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


Posted in Javascript onJanuary 31, 2019

在 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>

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

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
IE6背景图片不缓存问题解决方案及图片使用策略多个方法小结
May 14 Javascript
JS关闭窗口或JS关闭页面的几种代码分享
Oct 25 Javascript
jQuery中的编程范式详解
Dec 15 Javascript
jquery点击改变class并toggle的实现代码
May 15 Javascript
通过javascript进行UTF-8编码的实现方法
Jun 27 Javascript
JavaScript学习小结之被嫌弃的eval函数和with语句实例详解
Aug 01 Javascript
jQuery表单验证之密码确认
May 22 jQuery
jquery.masonry瀑布流效果
May 25 jQuery
微信小程序 自定义消息提示框
Aug 06 Javascript
vue中添加mp3音频文件的方法
Mar 02 Javascript
vue 点击按钮实现动态挂载子组件的方法
Sep 07 Javascript
jQuery实现文本显示一段时间后隐藏的方法分析
Jun 20 jQuery
微信小程序开发的基本流程步骤
Jan 31 #Javascript
JSON的parse()方法介绍
Jan 31 #Javascript
JSON.stringify()方法讲解
Jan 31 #Javascript
Vue实现远程获取路由与页面刷新导致404错误的解决
Jan 31 #Javascript
vue中的mvvm模式讲解
Jan 31 #Javascript
Vue和React组件之间的传值方式详解
Jan 31 #Javascript
使用Angular Cli如何创建Angular私有库详解
Jan 30 #Javascript
You might like
PHP+DBM的同学录程序(2)
2006/10/09 PHP
php数组函数序列之in_array() 查找数组值是否存在
2011/10/29 PHP
解析PHP自带的进位制之间的转换函数
2013/06/08 PHP
PHP实现视频文件上传完整实例
2014/08/28 PHP
php返回json数据函数实例
2014/10/09 PHP
php 字符串中是否包含指定字符串的多种方法
2018/04/12 PHP
php源码的安装方法和实例
2019/09/26 PHP
js字符串日期yyyy-MM-dd转化为date示例代码
2014/03/06 Javascript
window.location不跳转的问题解决方法
2014/04/17 Javascript
JS实现从连接中获取youtube的key实例
2015/07/02 Javascript
jquery-tips悬浮提示插件分享
2015/07/31 Javascript
跟我学习javascript的执行上下文
2015/11/18 Javascript
JavaScript中利用构造器函数模拟类的方法
2017/02/16 Javascript
jQuery常用选择器详解
2017/07/17 jQuery
详解从Vue-router到html5的pushState
2018/07/21 Javascript
详解关于微信setData回调函数中的坑
2019/02/18 Javascript
ES10 特性的完整指南小结
2019/03/04 Javascript
vue-cli3中vue.config.js配置教程详解
2019/05/29 Javascript
微信小程序实现点击按钮后修改颜色
2019/12/05 Javascript
详解ES6 中的Object.assign()的用法实例代码
2021/01/11 Javascript
python之wxPython应用实例
2014/09/28 Python
python构建自定义回调函数详解
2017/06/20 Python
Python实现拷贝/删除文件夹的方法详解
2018/08/29 Python
python 执行文件时额外参数获取的实例
2018/12/18 Python
python微信聊天机器人改进版(定时或触发抓取天气预报、励志语录等,向好友推送)
2019/04/25 Python
python3使用GUI统计代码量
2019/09/18 Python
windows中安装Python3.8.0的实现方法
2019/11/19 Python
python实现梯度下降算法的实例详解
2020/08/17 Python
python“静态”变量、实例变量与本地变量的声明示例
2020/11/13 Python
北承题目(C++)
2012/05/16 面试题
怎样自定义一个异常类
2016/09/27 面试题
教师实习自我鉴定
2013/12/13 职场文书
信息管理应届生求职信
2014/03/07 职场文书
本科毕业生求职信
2014/06/15 职场文书
2015年信息技术教研组工作总结
2015/07/22 职场文书
golang 在windows中设置环境变量的操作
2021/04/29 Golang