本文主要介绍如何使用Vue来绑定操作元素的class列表和内联样式(style属性).
因为class和style都是属性,所以通过v-bind命令来处理它们:只需要通过表达式计算出结果即可,不过字符串拼接麻烦且易错。因此,再将v-bind用于class和style属性时,Vue.js做了专门的增强,表达式结果类型除了字符串以外还可以是对象或者数组.
1、绑定Class
可以通过v-bind:class一个对象,以动态的切换class,代码如下:
<div id="tDiv" v-bind:class="{ active: isActive }">asdasd</div>
js代码如下:
var currentPage=new Vue({ el:"#tDiv", //指定绑定的目标dom元素的Id //绑定数据源 data: { isActive: true, hasError: false } });
原文:http://www.cnblogs.com/GreenLeaves/p/7819571.html