vue 实现v-for循环回来的数据动态绑定id


Posted in Javascript onNovember 07, 2019

如下所示:

vue 实现v-for循环回来的数据动态绑定id

代码效果图!!!!!

<ul>
<li v-for="(site,index) in sites" :key="index" :id="forId(index)">
 <span class="channel-li-li-border">
 <span class="firstLevel">{{site.name}}</span>
 </span>
</li>
</ul>
<script>
 new Vue({
 el: '#cat2s',
 data: function(){
 return {
 brandList: [],
 sites: [
   { name: '품질검수 서비스' },
   { name: '배송물류 서비스' },
   { name: '브랜드사 리스트'}
  ]
 }
 },
 methods: {
 forId:function(index){
 return "forid_" +index
 },
}
})
</script>

以上这篇vue 实现v-for循环回来的数据动态绑定id就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
自适应图片大小的弹出窗口
Jul 27 Javascript
Jquery 设置标题的自动翻转
Oct 03 Javascript
JavaScript中__proto__与prototype的关系深入理解
Dec 04 Javascript
JS控制弹出悬浮窗口(一览画面)的实例代码
May 30 Javascript
mvc中form表单提交的三种方式(推荐)
Aug 10 Javascript
jQuery元素属性操作实例(设置、获取及删除元素属性)
Sep 08 Javascript
js实现登录验证码
Dec 22 Javascript
脚本div实现拖放功能(两种)
Feb 13 Javascript
Bootstrap实现基于carousel.js框架的轮播图效果
May 02 Javascript
Angular2安装angular-cli
May 21 Javascript
解决vue的过渡动画无法正常实现问题
Oct 31 Javascript
Vue实现返回顶部按钮实例代码
Oct 21 Javascript
vue改变循环遍历后的数据实例
Nov 07 #Javascript
vue element-ui el-date-picker限制选择时间为当天之前的代码
Nov 07 #Javascript
vue v-for直接循环数字实例
Nov 07 #Javascript
jsonp格式前端发送和后台接受写法的代码详解
Nov 07 #Javascript
js实现数字从零慢慢增加到指定数字示例
Nov 07 #Javascript
详解Angular cli配置过程记录
Nov 07 #Javascript
ZK中使用JS读取客户端txt文件内容问题
Nov 07 #Javascript
You might like
dedecms系统常用术语汇总
2007/04/03 PHP
PHP Header用于页面跳转要注意的几个问题总结
2008/10/03 PHP
PHP DataGrid 实现代码
2009/08/12 PHP
实测在class的function中include的文件中非php的global全局环境
2013/07/15 PHP
header导出Excel应用示例
2014/01/24 PHP
php常用的url处理函数总结
2014/11/19 PHP
JQuery操作表格(隔行着色,高亮显示,筛选数据)
2012/02/23 Javascript
Jquery上传插件 uploadify v3.1使用说明
2012/06/18 Javascript
JS解决url传值出现中文乱码的另类办法
2013/04/08 Javascript
浅析onsubmit校验表单时利用ajax的return false无效问题
2013/07/10 Javascript
Jquery 的outerHeight方法使用介绍
2013/09/11 Javascript
jquery表单验证框架提供的身份证验证方法(示例代码)
2013/12/27 Javascript
js对字符的验证方法汇总
2015/02/04 Javascript
JavaScript采用递归算法计算阶乘实例
2015/08/04 Javascript
JavaScript中匿名函数的用法及优缺点详解
2016/06/01 Javascript
前端面试题及答案整理(二)
2016/08/26 Javascript
js 判断附件后缀的简单实现方法
2016/10/11 Javascript
JS百度地图搜索悬浮窗功能
2017/01/12 Javascript
从零学习node.js之利用express搭建简易论坛(七)
2017/02/25 Javascript
socket.io学习教程之基本应用(二)
2017/04/29 Javascript
vue2.5.2使用http请求获取静态json数据的实例代码
2018/02/27 Javascript
vue.js过滤器+ajax实现事件监听及后台php数据交互实例
2018/05/22 Javascript
js DOM的事件常见操作实例详解
2019/12/16 Javascript
Python 深入理解yield
2008/09/06 Python
用Python写飞机大战游戏之pygame入门(4):获取鼠标的位置及运动
2015/11/05 Python
Python3非对称加密算法RSA实例详解
2018/12/06 Python
Python线性拟合实现函数与用法示例
2018/12/13 Python
Python-while 计算100以内奇数和的方法
2019/06/11 Python
pytorch绘制并显示loss曲线和acc曲线,LeNet5识别图像准确率
2020/01/02 Python
对Pytorch 中的contiguous理解说明
2021/03/03 Python
可持续未来的时尚基础:Alternative Apparel
2019/05/06 全球购物
聘用意向书范本
2014/04/01 职场文书
技术负责人任命书
2014/06/05 职场文书
音乐教育专业自荐信
2014/09/18 职场文书
golang在GRPC中设置client的超时时间
2021/04/27 Golang
css 边框添加四个角的实现代码
2021/10/16 HTML / CSS