vue.js在标签属性中插入变量参数的方法


Posted in Javascript onMarch 06, 2018

html的标签的属性,比如id、class、href需要动态传递参数,拼接字符串,查了一些资料,并没有找到合适的解决方法,琢磨了一上午,终于试出了方法:

vue.js在标签属性中插入变量参数的方法

v-bind:属性=“ ‘字符串'+自定义变量名”,自己试了没问题,有需要的朋友可以借鉴下!

最后需要注意一下属性一定是":属性="这种形式才会起作用

<ul class="menu" v-for="(item,index) in 4">
              <li :class="{'selected':index===clickIndex}" @click="selected(index)">
                <div>
                  <h3>{{item}}点位标签</h3>
                  <span style="margin: 15px 0px;">附近的资产:3个(2个未完成修订)</span><br />
                  <img :src="'img/'+(item+nameIndex)+'.jpg'" />
                  <a href="#" rel="external nofollow" ></a>
                </div>
              </li>
    </ul>

总结

以上所述是小编给大家介绍的vue.js在标签属性中插入变量参数的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
window.open被浏览器拦截后的自定义提示效果代码
Nov 19 Javascript
这段js代码得节约你多少时间
Dec 20 Javascript
JavaScript自动设置IFrame高度的小例子
Jun 08 Javascript
js(JavaScript)实现TAB标签切换效果的简单实例
Feb 26 Javascript
JS日期格式化之javascript Date format
Oct 01 Javascript
JavaScript中利用各种循环进行遍历的方式总结
Nov 10 Javascript
javascript实现拖动元素交换位置
Nov 29 Javascript
AngularJS入门教程之模块化操作用法示例
Nov 02 Javascript
使用mpvue搭建一个初始小程序及项目配置方法
Dec 03 Javascript
vue element-ui table组件动态生成表头和数据并修改单元格格式 父子组件通信
Aug 15 Javascript
layui实现多图片上传并限制上传的图片数量
Sep 26 Javascript
小程序点餐界面添加购物车左右摆动动画
Sep 23 Javascript
基于Vue中点击组件外关闭组件的实现方法
Mar 06 #Javascript
解决vue build打包之后首页白屏的问题
Mar 06 #Javascript
vue2.0 路由不显示router-view的解决方法
Mar 06 #Javascript
解决vue-router进行build无法正常显示路由页面的问题
Mar 06 #Javascript
解决vue打包项目后刷新404的问题
Mar 06 #Javascript
写一个移动端惯性滑动&amp;回弹Vue导航栏组件 ly-tab
Mar 06 #Javascript
vue使用xe-utils函数库的具体方法
Mar 06 #Javascript
You might like
星际争霸秘籍
2020/03/04 星际争霸
虹吸式咖啡壶操作
2021/03/03 冲泡冲煮
php 图片上添加透明度渐变的效果
2009/06/29 PHP
非常好用的两个PHP函数 serialize()和unserialize()
2012/02/04 PHP
超级退弹代码
2008/07/07 Javascript
javascript刷新父页面的各种方法汇总
2014/09/03 Javascript
JS获取图片lowsrc属性的方法
2015/04/01 Javascript
JavaScript中的acos()方法使用详解
2015/06/14 Javascript
微信小程序  audio音频播放详解及实例
2016/11/02 Javascript
NodeJS整合银联网关支付(DEMO)
2016/11/09 NodeJs
最常见的左侧分类菜单栏jQuery实现代码
2016/11/28 Javascript
jquery实现瀑布流效果 jquery下拉加载新数据
2016/12/12 Javascript
微信小程序 利用css实现遮罩效果实例详解
2017/01/21 Javascript
详解浏览器渲染页面过程
2017/02/09 Javascript
HTML5开发Kinect体感游戏的实例应用
2017/09/18 Javascript
详解Vue demo实现商品列表的展示
2019/05/07 Javascript
JS实现电脑虚拟键盘的操作
2020/06/24 Javascript
JS实现无限轮播无倒退效果
2020/09/21 Javascript
[02:16]卖萌的僵尸 DOTA2神话信使飞僵小宝来袭
2014/03/24 DOTA
python多线程用法实例详解
2015/01/15 Python
Python下使用Psyco模块优化运行速度
2015/04/05 Python
Python语言实现将图片转化为html页面
2017/12/06 Python
Python实现判断给定列表是否有重复元素的方法
2018/04/11 Python
pandas获取groupby分组里最大值所在的行方法
2018/04/20 Python
python实现输入的数据在地图上生成热力图效果
2019/12/06 Python
python 串行执行和并行执行实例
2020/04/30 Python
部署Django到阿里云服务器教程示例
2020/06/03 Python
浅谈numpy中函数resize与reshape,ravel与flatten的区别
2020/06/18 Python
Canvas 像素处理之改变透明度的实现代码
2019/01/08 HTML / CSS
英国现代、当代和设计师家具店:Furntastic
2020/07/18 全球购物
工业设计专业自荐书
2014/06/05 职场文书
学习教师敬业奉献模范事迹材料思想汇报
2014/09/19 职场文书
地方白酒代理协议书
2014/10/25 职场文书
驻村工作简报
2015/07/20 职场文书
2016年中学植树节活动总结
2016/03/16 职场文书
小学作文指导之如何写人?
2019/07/08 职场文书