跳至内容

vue/prefer-true-attribute-shorthand

v-bind 值为 true 时,要求使用简写形式的属性。

  • 💡 此规则报告的一些问题可以通过编辑器 建议 手动修复。

📖 规则详情

v-bind 属性与 true 值通常可以写成简写形式。这可以减少冗余。

正在加载...

警告

简写形式并不总是等效的!如果一个 prop 接受多种类型,但 Boolean 不是第一个,简写 prop 不会传递 true

vue
<script>
export default {
  name: 'MyComponent',
  props: {
    bool: Boolean,
    boolOrString: [Boolean, String],
    stringOrBool: [String, Boolean],
  }
}
</script>

简写形式

vue
<MyComponent bool bool-or-string string-or-bool />
txt
bool: true (boolean)
boolOrString: true (boolean)
stringOrBool: "" (string)

长格式

vue
<MyComponent :bool="true" :bool-or-string="true" :string-or-bool="true" />
txt
bool: true (boolean)
boolOrString: true (boolean)
stringOrBool: true (boolean)

这两个调用将引入不同的渲染结果。查看 此演示

🔧 选项

默认选项为 "always"

json
{
  "vue/prefer-true-attribute-shorthand": ["error", "always" | "never"]
}
  • "always" (默认) ... 要求使用简写形式。
  • "never" ... 要求使用长格式。

"never"

正在加载...

🚀 版本

此规则在 eslint-plugin-vue v8.5.0 中引入。

🔍 实现