# computed-property-spacing

在计算的属性括号内强制执行一致的间距

一些该规则报告的问题可以通过 --fix 命令行选项 自动修复

虽然格式化偏好是非常个人化的,但在以下情况下,许多样式指南要求或不允许计算属性之间存在空格:

/*eslint-env es6*/

var obj = { prop: "value" };
var a = "prop";
var x = obj[a]; // computed property in object member expression

var a = "prop";
var obj = {
  [a]: "value" // computed property key in object literal (ECMAScript 6)
};

var obj = { prop: "value" };
var a = "prop";
var { [a]: x } = obj; // computed property key in object destructuring pattern (ECMAScript 6)

# 规则详情

此规则强制计算属性括号内的间距一致。

它要求或不允许括号和其中的值之间有空格。此规则不适用于通过换行符与相邻值分隔的括号。

# 选项

该规则有两个选项,一个字符串选项和一个对象选项。

字符串选项:

  • "never"(默认)不允许计算属性括号内有空格
  • "always" 在计算属性括号内需要一个或多个空格

对象选项:

  • "enforceForClassMembers": true(默认)另外将此规则应用于类成员。

# never

此规则使用默认 "never" 选项的错误代码示例:

/*eslint computed-property-spacing: ["error", "never"]*/
/*eslint-env es6*/

obj[foo ]
obj[ 'foo']
var x = {[ b ]: a}
obj[foo[ bar ]]

const { [ a ]: someProp } = obj;
({ [ b ]: anotherProp } = anotherObj);

此规则使用默认 "never" 选项的正确代码示例:

/*eslint computed-property-spacing: ["error", "never"]*/
/*eslint-env es6*/

obj[foo]
obj['foo']
var x = {[b]: a}
obj[foo[bar]]

const { [a]: someProp } = obj;
({ [b]: anotherProp } = anotherObj);

# always

此规则使用 "always" 选项的错误代码示例:

/*eslint computed-property-spacing: ["error", "always"]*/
/*eslint-env es6*/

obj[foo]
var x = {[b]: a}
obj[ foo]
obj['foo' ]
obj[foo[ bar ]]
var x = {[ b]: a}
const { [a]: someProp } = obj;
({ [b ]: anotherProp } = anotherObj);

此规则使用 "always" 选项的正确代码示例:

/*eslint computed-property-spacing: ["error", "always"]*/
/*eslint-env es6*/

obj[ foo ]
obj[ 'foo' ]
var x = {[ b ]: a}
obj[ foo[ bar ] ]
const { [ a ]: someProp } = obj;
({ [ b ]: anotherProp } = anotherObj);

# enforceForClassMembers

enforceForClassMembers 设置为 true(默认)时,该规则还禁止/强制在类方法、getter 和 setter 的计算键内使用空格。

此规则的错误代码示例与 "never"{ "enforceForClassMembers": true }(默认):

/*eslint computed-property-spacing: ["error", "never", { "enforceForClassMembers": true }]*/
/*eslint-env es6*/

class Foo {
  [a ]() {}
  get [b ]() {}
  set [b ](value) {}
}

const Bar = class {
  [ a](){}
  static [ b]() {}
  static get [ c ]() {}
  static set [ c ](value) {}
}

此规则的正确代码示例与 "never"{ "enforceForClassMembers": true }(默认):

/*eslint computed-property-spacing: ["error", "never", { "enforceForClassMembers": true }]*/
/*eslint-env es6*/

class Foo {
  [a]() {}
  get [b]() {}
  set [b](value) {}
}

const Bar = class {
  [a](){}
  static [b]() {}
  static get [c]() {}
  static set [c](value) {}
}

此规则的正确代码示例(带有 "never"{ "enforceForClassMembers": false }):

/*eslint computed-property-spacing: ["error", "never", { "enforceForClassMembers": false }]*/
/*eslint-env es6*/

class Foo {
  [a ]() {}
  get [b ]() {}
  set [b ](value) {}
}

const Bar = class {
  [ a](){}
  static [ b]() {}
  static get [ c ]() {}
  static set [ c ](value) {}
}

# 何时不使用

如果您不关心计算属性的一致性,您可以关闭此规则。

Last Updated: 5/13/2023, 8:55:38 PM