가치 없는 Vue 컴포넌트 소품

가치 없는 Vue 컴포넌트 소품

내 컴포넌트에 값을 지정하지 않고 속성을 설정하려고 합니다.예를 들어 다음과 같습니다.

<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/

중요한 것은 소품 유형을 선언하는 것입니다.Boolean:

props: {
    primary: Boolean
}

그런 다음 속성 이름만 지정하면 값이 다음과 같이 설정됩니다.true.

작업 JSFiddle: https://jsfiddle.net/LukaszWiktor/gfa7gkdb/

언급URL : https://stackoverflow.com/questions/44602795/vue-component-props-without-value