vue.js条件与循环语句
2017-12-19 本文已影响12人
张小小小七
条件语句：
- v-if =" seen " / " type==='A' "
- 单独使用，可结合<template>使用，根据表达式 seen 的值(true 或 false )来决定是否插入 template 元素。
- 和v-else、v-else-if 配合使用。
- v-show =" seen "
使用 v-show 指令来根据条件展示元素。
循环语句：
- v-for
- 数组迭代：以 site in sites 形式。
sites 是源数据数组并且 site 是数组元素迭代的别名。通过别名引用对象属性。
<li v-for="site in sites">
{{ site.name }}
</li>
- 对象迭代：以" (value, key, index) in object "形式。
通过一个对象的属性来迭代数据。第2参数key：键名；第3参数index:索引。后两个参数可省略，去掉括号。
另外：在迭代属性输出的之前，v-for会对属性进行升序排序输出。
<li v-for="value in object">
{{ value }}
</li>
<li v-for="(value, key, index) in object">
{{ index }}. {{ key }} : {{ value }}
</li>
- 整数迭代：以 n in number形式。
<li v-for="n in 10">
{{ n }}
</li>
循环迭代in可用of代替
