vue.js--菜鸟级入门
Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的。相比于Angular.js,Vue.js提供了更加简洁、更易于理解的API,使得我们能够快速地上手并使用Vue.js。
它通过一些特殊的HTML语法,将DOM和数据绑定起来。一旦你创建了绑定,DOM将和数据保持同步,每当变更了数据,DOM也会相应地更新。(主要是数据绑定 通过几个绑定定义区域(也就是所说的作用区域))
常用指令
- v-if指令 v-if指令是根据条件表达式的值来执行元素的插入或者删除行为。
- v-show指令
v-show
也是条件渲染指令,和v-if指令不同的是,使用v-show
指令的元素始终会被渲染到HTML,它只是简单地为元素设置CSS的style属性。 - v-else 指令 可以用
v-else
指令为v-if
或v-show
添加一个“else块”。v-else
元素必须立即跟在v-if
或v-show
元素的后面——否则它不能被识别。 - v-for指令 遍历数组(循环时候用)
- v-bind指令
v-bind
指令可以在其名称后面带一个参数,中间放一个冒号隔开,这个参数通常是HTML元素的特性(attribute) - v-on指令
v-on
指令用于给监听DOM事件,它的用语法和v-bind是类似的,例如监听<a>元素的点击事件:
v-for
指令基于一个数组渲染一个列表,它和JavaScript的遍历语法相似: v-for="item in items"items是一个数组,item是当前被遍历的数组元素。
总结:v-if 和 v-show都能实现元素的显示和不显示 唯一区别就是v-show简单为元素设置css的style属性