这篇文章主要介绍Vue中v-for指令有什么用,文中介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们一定要看完!
v-for
用 v-for 指令根据遍历数组来进行渲染
有下面两种遍历形式
<div v-for="(item,index) in items"></div> //使用in,index是一个可选参数,表示当前项的索引 <div v-for="item of items"></div> //使用of
下面是一个例子,并且在 v-for 中,拥有对父作用域属性的完全访问权限。
<ul id="app"> <li v-for="item in items"> {{parent}}-{{item.text}} </li> </ul> <script type="text/javascript"> var example = new Vue({ el:'#app', data:{ parent:'父作用域' items:[ {text:'文本1'}, {text:'文本2'} ] } }) </script>
会被渲染为:
<ul id="app"> <li>父作用域-文本1</li> <li>父作用域-文本2</li> </ul>
注意:当 v-for 和 v-if 同处于一个节点时,v-for 的优先级比 v-if 更高。这意味着 v-if 将运行在每个 v-for 循环中
以上是“Vue中v-for指令有什么用”这篇文章的所有内容,感谢各位的阅读!希望分享的内容对大家有帮助,更多相关知识,欢迎关注云搜网行业资讯频道!