没有值的Vue组件道具

Question

我想在我的组件上设置一个没有任何价值的属性。例如：

<my-button primary>Save</my-button> 

我在我的组件的props宣布primary：

Vue.component("my-button", { 
    props: ["primary"], 
    template: "<button v-bind:class='{primary: primary}'><slot></slot></button>" 
}) 

不幸的是，这是行不通的。 primary属性为undefined，该类不适用。

的jsfiddle：https://jsfiddle.net/LukaszWiktor/g3jkscna/

Answer 1

的关键是声明支柱类型Boolean：

​​

然后仅指定属性名使得其值设置为true。

工作的jsfiddle：https://jsfiddle.net/LukaszWiktor/gfa7gkdb/