Question

在组件的Vue文档中，它说：

包括没有价值的道具会暗示true： <blog-post favorited></blog-post>

但是，当我在我的组件上尝试它时，它不起作用（related fiddle）：

<!-- html -->
<div id="app">
  <test-component visible></test-component>
</div>

<template id="template">
  <span>open: {{ open }}; visible: {{ visible }}</span>
</template>

<!-- JS -->
const TestComponent = Vue.extend({
  template: '#template',
  props: ['visible'],
  data: function() {
    return { 'open': true }
  }
});

new Vue({
  el: "#app",
  components: {
    'test-component': TestComponent
  }
});

这是一个错误还是我做错了什么？

Answer 1

我也希望它能够正常工作，但似乎你需要在props声明中指定字段的类型：

props: {
    'visible': {
        type: Boolean
    }
}

这使它可以正常工作

简短的手将布尔道具传递给Vue组件

1 个答案: