vue.js 常用指令攻略
Vue.js的指令是以v-开首的，它们感化于HTML元素，指令供给了一些特别的特征，将指令绑心猿意马在元素上时，指令会为绑心猿意马的方针元素添加一些特别的行为，我们可以将指令看作特别的HTML特征（attribute）。
东西/原料
- vue.js
- 代码编纂器
- 浏览器
方式/步调
- 1
v-if指令
v-if是前提衬着指令，它按照表达式的真假来删除和插入元素，它的根基语法如下：
v-if="expression"
expression是一个返回bool值的表达式，表达式可所以一个bool属性，也可所以一个返回bool的运算式。例如：
- 2
v-show指令
v-show也是前提衬着指令，和v-if指令分歧的是，利用v-show指令的元素始终会被衬着到HTML，它只是简单地为元素设置CSS的style属性。
- 3
v-else指令
可以用v-else指令为v-if或v-show添加一个“else块”。v-else元素必需当即跟在v-if或v-show元素的后面——不然它不克不及被识别。
- 4
v-for指令
v-for指令基于一个数组衬着一个列表，它和JavaScript的遍历语法相似：
v-for="item in items"
items是一个数组，item是当前被遍历的数组元素。
- 5
v-bind指令
v-bind指令可以在其名称后面带一个参数，中心放一个冒号离隔，这个参数凡是是HTML元素的特征（attribute），例如：v-bind:class
v-bind:argument="expression"
下面这段代码构建了一个简单的分页条，v-bind指令感化于元素的class特征上。这个指令包含一个表达式，表达式的寄义是：高亮当前页。
- 6
v-on指令
v-on指令用于给监听DOM事务，它的用语法和v-bind是近似的，例如监听<a>元素的点击事务：
<a v-on:click="doSomething">
有两种形式挪用方式：绑心猿意马一个方式（让事务指标的目的方式的引用），或者利用内联语句。Greet按钮将它的单击事务直接绑心猿意马到greet()方式，而Hi按钮则是挪用say()方式。
注重事项
- v-bind和v-on可以别离缩写为 ：和 @
- 发表于 2018-08-23 00:00
- 阅读 ( 1187 )
- 分类：其他类型
0 篇文章
作家榜 »
-
xiaonan123
189 文章
-
汤依妹儿
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
华志健
23 文章