无价值的Vue组件道具

属性 Vue.js

小胖LEY西门

2020-03-13

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

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

我声明了primary在props我的组件：

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

不幸的是，它不起作用。该primary属性是undefined，该类未应用。

JSFiddle：https：//jsfiddle.net/LukaszWiktor/g3jkscna/

第1405篇《无价值的Vue组件道具》来自Winter(https://github.com/aiyld/aiyld.github.io)的站点

共1个回答

小胖LEY西门 2020.03.13

关键是将道具的类型声明为Boolean：

props: {
    primary: Boolean
}

然后，仅指定属性名称，将其值设置为true。

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

相似问题

0 回答

0 回答

5 回答

25 回答

0 回答

0 回答

问题类别

JavaScript Ckeditor Python Webpack TypeScript Vue.js React.js ExpressJS KoaJS CSS Node.js HTML Django 单元测试 PHP Asp.net jQuery Bootstrap IOS Android