Question

var vm = new Vue({
  el: '#one-example',
  props: {
    maximize: Boolean,
  },
});

<div id="one-example" maximize>
  <p v-if="maximize">Hello vue!</p>
  {{maximize}}
</div>

我在这里缺少什么？ {{maximize}}在这里是假的，不应该是真的，因为它在这里初始化了吗？ <div id="one-example" maximize>

https://jsfiddle.net/8ucdt58p/

Answer 1

不确定你想用这个来实现。但我认为你应该把数据最大化。

<div id="one-example" >  
  <p v-if="maximize">Hello vue!</p>
  {{maximize}}
</div>


var vm = new Vue({
  el: '#one-example',
  data: function(){
   return{
    maximize:true
   }
  }
});

否则通过组件＆amp;道具：

<html>
    <head>
        <script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
    </head>
    <body>
    <div id="app">
      <one-example :maximize="false"></one-example>
    </div>

    <script>
        Vue.component('one-example', {
         props: ['maximize'],
         template: '<div  >  <p v-if="maximize">Hello vue!</p>  {{maximize}} </div>'
       });

       var vm = new Vue({
        el: '#app'
       });

    </script>
    </body>
</html>

如果您不需要真/假状态以实现最大化，但是设置为某事物/未设置...... （如下面的评论中所述）最大化也可以设置为：

   <one-example maximize="anything"></one-example>

或未设置或无效

   <one-example ></one-example>
   <one-example maximize=""></one-example>

vue布尔属性不起作用

1 个答案: