vue中v-on和v-bind的区别（Vue学习基础编-v-bind绑定class对象语法）

vue中v-on和v-bind的区别（Vue学习基础编-v-bind绑定class对象语法）下面我们定义个isActive属性来决定class的属性，请看下面的列子，我们使用个按钮来决定class的变化，点击按钮将message的颜色进行改变。请看实现效果图如果我有讲的不对的方法，谢谢大家指正。

在Vue中v-bind可以绑定一些html属性，但用在比较多的地方就是v-bind绑定class属性上，话不多说，直接上代码。如下图，我们一般是直接在class中加属性，也可以在Vue中使用data数据active，将active绑定到class上，这里说下v-bind:class = :class

我们看下效果：

大家可能发现这种写法差不多，甚至用Vue写得更加麻烦，接下给大家展示class对象的写法，在class中用键值对的形式写，当class中属性为true时，就是显示两个属性。

显示效果如下：这样我们就能用Vue控制ture和false来决定是否显示属性。

下面我们定义个isActive属性来决定class的属性，请看下面的列子，我们使用个按钮来决定class的变化，点击按钮将message的颜色进行改变。

请看实现效果图

如果我有讲的不对的方法，谢谢大家指正。