如何让Emmet生成一个没有引号的自定义JSX属性

Question

我正在尝试删除Emmet围绕props.onInitiateBattle自定义属性值生成的引号onClick.

我的输入(然后CTRL + E展开,类似于制表符):
button.btn[type="button"][onClick={props.onInitiateBattle}]

Emmet的输出:
<button className="btn" type="button" onClick="{props.onInitiateBattle}"></button>

注意props.onInitiateBattle引用,这是不好的.

我期待什么(道具......没有引号):
<button className="btn" type="button" onClick={props.onInitiateBattle}></button>

将它包裹在双支架周围也不起作用.

Answer 1

要使单引号与 JSX 一起使用，您需要使用语法配置文件在~/emmet中更新或创建syntaxProfiles.json 。我相信键是文件扩展名，值是扩展名将使用的配置文件的名称。

/* ~/emmet/syntaxProfiles.json */

/* 'js' 将映射具有 .js 扩展名的文件以使用 js 配置文件*/ /* 'jsx' 将映射具有 .jsx 扩展名的文件以也使用 js 配置文件*/

{
  "js": "js",
  "jsx": "js"
}

/* ~/emmet/profiles.json */

/* 创建或添加 'js' 配置文件 */

{
  "html": {
    "attr_quotes": "double"
  },
  "js": {
    "attr_quotes": "single",
    "self_closing_tag": true
  }
}

更多信息