javascript - Vue.js里，绑定class用一个计算属性是什么意思？

Question

http://cn.vuejs.org/guide/class-and-style.html

你也可以直接绑定数据里的一个对象：

<p v-bind:class="classObject"></p>
data: {
  classObject: {
    'class-a': true,
    'class-b': false
  }
}

我们也可以在这里绑定一个返回对象的计算属性。这是一个常用且强大的模式。

怎样在这里使用计算属性，能否举例说明？

Answer 1

可能是这个意思

computed:{
   classObject: function(){
        return  true ?  {
                'class-a': true,
                'class-b': false
              }:  {
                'class-a': false,
                'class-b': false
              };
   }
}

Answer 2

就是如果 classObject = {'class-a': true, 'class-b': false} 则最后渲染结果为 <p class="class-a"></p>，如果两个都为 true 则为 <p class="class-a class-b"></p>

Answer 3

就是说class里面那个对象，可以通过key是classname，值是true or false的形式，很灵活的控制该元素上的class。返回的意思是你通过计算返回一个这种对象，key可以算，value也可以算，拼出来一个。