Question

我正在IntelliJ中使用React，遇到了一个令人讨厌的问题。在编写JSX时（例如在Render中），IntelliJ在我按Enter /自动完成属性时会自动插入两个{}。

例如，编写以下JS代码时：

const SomeCompenent = () => {
    return (
        <div className="someClassName">
    )
};

IntelliJ自动写入className={}

这种假设假设我将始终使用需要{}语法的道具。但是，它使用所有不必要的{}都会降低代码（imo）的可读性。

我在文件->设置->编辑器->常规->智能键中尝试了一些不同的设置，但无济于事。

希望有人能够提供帮助。

Answer 1

IntelliJ 仍然没有在 UI 中公开 JSX 属性样式，但事实证明您可以手动编辑配置文件。这在 IntelliJ Ultimate 2020.3 中对我有用：

将代码样式方案切换为存储在项目中。
在 /.idea/codeStyles/FoobarSchemeName.xml 打开配置文件。
在 <option name="JSX_ATTRIBUTE_VALUE" value="Based on type" /> 下添加 JSCodeStyleSettings 条目以默认为 " 而不是 { 用于字符串道具，或者 value="None" 既不附加 " 也不附加{。
重启 IntelliJ。仅仅重新打开项目对我来说还不够。

如果您缺少 JSCodeStyleSettings，请按如下方式添加：

<component name="ProjectCodeStyleConfiguration">
  <code_scheme name="Project" version="173">
    <JSCodeStyleSettings version="0">
      <option name="JSX_ATTRIBUTE_VALUE" value="Based on type" />
    </JSCodeStyleSettings>
  </code_scheme>
</component>

IntelliJ如何在编写JSX时自动转{}

1 个答案: