vue.js指令v-for使用以及下标索引的获取

久曲健的测试窝

于 2020-02-05 13:58:00 发布

阅读量44

点赞数

文章标签： vue.js 前端 javascript ecmascript 前端框架

本文链接：https://blog.csdn.net/wangqiang_cyou/article/details/133112549

版权

在 v-for 代码块中，我们可以完全地访问父级作用域下的属性。

v-for 还支持可选的第二个参数，作为当前项的索引。

也可以使用 v-for 来遍历对象的属性。

还可以提供第二个参数，作为对象的键名(key)：

<body> 
<div id="box"> 
  <ul> 
    <li @click="onclick(index)" v-for="(item,index) in dataList">{{item.name}}</li> 
  </ul> 
</div> 
</body> 
<script src="assets/vue/vue.js"></script> 
<script> 
  new Vue({ 
    el:"#box", 
    data:{ 
      dataList:[ 
        {name:"子鼠"}, 
        {name:"丑牛"}, 
        {name:"寅虎"}, 
        {name:"卯兔"}, 
        {name:"辰龙"} 
      ] 
    }, 
    methods:{ 
      onclick:function(index){ 
        alert(index); 
      } 
    } 
  }) 
</script>

久曲健的测试窝

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
vue.js指令v-for使用以及下标索引的获取

在v-for代码块中，我们可以完全地访问父级作用域下的属性。v-for还支持可选的第二个参数，作为当前项的索引。也可以使用v-for来遍历对象的属性。还可以提供第二个参数，作为对象的键名(key)：<body> <div id="box"> <ul> <li @click="onclick(index)" v-for...
复制链接

扫一扫