文档建议反馈控制台
首页
学习
活动
专区
工具
TVP
最新优惠活动
文章/答案/技术大牛
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

key-spacing

在--fix命令行上的选项可以自动修复一些被这条规则反映的问题。

此规则在对象字面量属性中强制在冒号周围放置空格。它可以单独验证每个属性，也可以确保对象文本中相邻属性的水平对齐。

规则细节

此规则强制在对象字面量属性中的键和值之间保持一致的间距。在长行的情况下，允许在允许空格的地方添加新行。

选项

该规则有一个对象选项：

  • "beforeColon": false （默认值）不允许在对象文字中的键和冒号之间使用空格。
  • "beforeColon": true 在对象文字中至少需要一个键和冒号之间的空格。
  • "afterColon": true （默认）需要在冒号和对象文字中的值之间至少有一个空格。
  • "afterColon": false 禁止冒号和对象字面值之间的空格。
  • "mode": "strict" （默认）在对象文字中冒号前或后执行一个空格。
  • "mode": "minimum" 在对象文字中的冒号之前或之后强制执行一个或多个空格。
  • "align": "value" 强制对象文字中值的水平对齐。
  • "align": "colon" 强制执行对象文字中冒号和值的水平对齐。
  • "align" 当值在对象文字中对齐时，使用对象值可以实现细粒度的间距。
  • "singleLine" 指定单线对象文字的间距样式。
  • "multiLine" 指定多线对象文字的间距样式。

请注意，您可以使用顶级选项或分组选项（singleLine和multiLine），但不能同时使用这两个选项。

beforeColon

此规则的默认代码错误代码示例{ "beforeColon": false }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "beforeColon": false }]*/

var obj = { "foo" : 42 };

具有默认选项的此规则的正确代码示例{ "beforeColon": false }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "beforeColon": false }]*/

var obj = { "foo": 42 };

此规则的错误代码示例包含以下{ "beforeColon": true }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "beforeColon": true }]*/

var obj = { "foo": 42 };

此规则的正确代码示例包含以下{ "beforeColon": true }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "beforeColon": true }]*/

var obj = { "foo" : 42 };

afterColon

此规则的默认代码错误代码示例{ "afterColon": true }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "afterColon": true }]*/

var obj = { "foo":42 };

具有默认选项的此规则的正确代码示例{ "afterColon": true }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "afterColon": true }]*/

var obj = { "foo": 42 };

此规则的错误代码示例包含以下{ "afterColon": false }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "afterColon": false }]*/

var obj = { "foo": 42 };

此规则的正确代码示例包含以下{ "afterColon": false }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "afterColon": false }]*/

var obj = { "foo":42 };

模式

此规则的默认代码错误代码示例{ "mode": "strict" }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "mode": "strict" }]*/

call({
    foobar: 42,
    bat:    2 * 2
});

具有默认选项的此规则的正确代码示例{ "mode": "strict" }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "mode": "strict" }]*/

call({
    foobar: 42,
    bat: 2 * 2
});

此规则的正确代码示例包含以下{ "mode": "minimum" }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "mode": "minimum" }]*/

call({
    foobar: 42,
    bat:    2 * 2
});

对齐

此规则的错误代码示例包含以下{ "align": "value" }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "align": "value" }]*/

var obj = {
    a: value,
    bcde:  42,
    fg :   foo()
};

此规则的正确代码示例包含以下{ "align": "value" }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "align": "value" }]*/

var obj = {
    a:    value,
    bcde: 42,

    fg: foo(),
    h:  function() {
        return this.a;
    },
    ijkl: 'Non-consecutive lines form a new group'
};

var obj = { a: "foo", longPropertyName: "bar" };

此规则的错误代码示例包含以下{ "align": "colon" }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "align": "colon" }]*/

call({
    foobar: 42,
    bat:    2 * 2
});

此规则的正确代码示例包含以下{ "align": "colon" }选项：

代码语言：javascript
复制
/*eslint key-spacing: ["error", { "align": "colon" }]*/

call({
    foobar: 42,
    bat   : 2 * 2
});

align

该align选项可以通过采取额外的配置beforeColon，afterColon，mode，和on选项。

如果align被定义为一个对象，但并非所有参数都被提供，那么未定义的参数将默认为以下值：

代码语言：javascript
复制
// Defaults
align: {
    "beforeColon": false,
    "afterColon": true,
    "on": "colon",
    "mode": "strict"
}

具有示例选项的此规则的正确代码示例{ "align": { } }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", {
    "align": {
        "beforeColon": true,
        "afterColon": true,
        "on": "colon"
    }
}]*/

var obj = {
    "one"   : 1,
    "seven" : 7
}
代码语言：javascript
复制
/*eslint key-spacing: ["error", {
    "align": {
        "beforeColon": false,
        "afterColon": false,
        "on": "value"
    }
}]*/

var obj = {
    "one":  1,
    "seven":7
}

align and multiLine

该multiLine和align选项可以不同，它允许对微调控制key-spacing您的文件。如果配置为对象，align将不会继承。multiLinealign

multiLine在对象文字跨越多行时使用。align当同一对象中有一组属性时使用该配置。例如：

代码语言：javascript
复制
var myObj = {
  key1: 1, // uses multiLine

  key2: 2, // uses align (when defined)
  key3: 3, // uses align (when defined)

  key4: 4 // uses multiLine
}

具有示例选项的此规则的不正确代码示例{ "align": { }, "multiLine": { } }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", {
    "multiLine": {
        "beforeColon": false,
        "afterColon":true
    },
    "align": {
        "beforeColon": true,
        "afterColon": true,
        "on": "colon"
    }
}]*/

var obj = {
    "myObjectFunction": function() {
        // Do something
    },
    "one"             : 1,
    "seven"           : 7
}

具有示例选项的此规则的正确代码示例{ "align": { }, "multiLine": { } }：

代码语言：javascript
复制
/*eslint key-spacing: ["error", {
    "multiLine": {
        "beforeColon": false,
        "afterColon": true

    },
    "align": {
        "beforeColon": true,
        "afterColon": true,
        "on": "colon"
    }
}]*/

var obj = {
    "myObjectFunction": function() {
        // Do something
        //
    }, // These are two separate groups, so no alignment between `myObjectFuction` and `one`
    "one"   : 1,
    "seven" : 7 // `one` and `seven` are in their own group, and therefore aligned
}

singleLine and multiLine

具有示例选项的此规则的正确代码示例{ "singleLine": { }, "multiLine": { } }：

代码语言：javascript
复制
/*eslint "key-spacing": [2, {
    "singleLine": {
        "beforeColon": false,
        "afterColon": true
    },
    "multiLine": {
        "beforeColon": true,
        "afterColon": true,
        "align": "colon"
    }
}]*/
var obj = { one: 1, "two": 2, three: 3 };
var obj2 = {
    "two" : 2,
    three : 3
};

何时不使用它

如果您有另一个属性间距约定可能与可用选项不一致，或者您想同时允许多个样式，则可以安全地禁用此规则。

版本

该规则在 ESLint 0.9.0中引入。

资源

本文档系腾讯云开发者社区成员共同维护，如有问题请联系 cloudcommunity@tencent.com

扫码关注腾讯云开发者

领取腾讯云代金券