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 相关文章推荐
JS+CSS制作DIV层可(最小化/拖拽/排序)功能实现代码
Feb 25 Javascript
jquery实现点击查看更多内容控制段落文字展开折叠效果
Aug 06 Javascript
浅谈javascript中replace()方法
Nov 10 Javascript
分享JavaScript监听全部Ajax请求事件的方法
Aug 28 Javascript
微信小程序 教程之条件渲染
Oct 18 Javascript
利用Angular.js限制textarea输入的字数
Oct 20 Javascript
jQuery实现动态添加tr到table的方法
Dec 26 Javascript
Canvas放置反弹效果随机图形(实例)
Aug 17 Javascript
webstorm中配置Eslint的两种方式及差异比较详解
Oct 19 Javascript
Vue基本使用之对象提供的属性功能
Apr 30 Javascript
ElementUI之Message功能拓展详解
Oct 18 Javascript
vue中父子组件的参数传递和应用示例
Jan 04 Vue.js
基于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
动态生成gif格式的图像要注意?
2006/10/09 PHP
详解:――如何将图片储存在数据库里
2006/12/05 PHP
解析如何用php screw加密php源代码
2013/06/20 PHP
thinkPHP基于ajax实现的菜单与分页示例
2016/07/12 PHP
php+ajax注册实时验证功能
2016/07/20 PHP
php语法检查的方法总结
2019/01/21 PHP
PHP PDOStatement::bindColumn讲解
2019/01/30 PHP
客户端js性能优化小技巧整理
2013/11/05 Javascript
JS实现转动随机数抽奖特效代码
2020/04/16 Javascript
js带前后翻页的图片切换效果代码分享
2015/09/08 Javascript
AngularJS学习笔记之依赖注入详解
2016/05/16 Javascript
vue-resource post数据时碰到Django csrf问题的解决
2020/03/13 Javascript
JS实现联想、自动补齐国家或地区名称的功能
2020/07/07 Javascript
vue 实现一个简单的全局调用弹窗案例
2020/09/10 Javascript
JS实现4位随机验证码
2020/10/19 Javascript
[01:29]Ti4循环赛第三日精彩回顾
2014/07/13 DOTA
[15:46]教你分分钟做大人——沙王
2015/03/11 DOTA
Python实现输出程序执行进度百分比的方法
2017/09/16 Python
对python中Matplotlib的坐标轴的坐标区间的设定实例讲解
2018/05/25 Python
python根据url地址下载小文件的实例
2018/12/18 Python
wxPython实现画图板
2020/08/27 Python
Python hashlib常见摘要算法详解
2020/01/13 Python
Django日志及中间件模块应用案例
2020/09/10 Python
CSS去掉A标签(链接)虚线框的方法
2014/04/01 HTML / CSS
详解Canvas 跨域脱坑实践
2018/11/07 HTML / CSS
意大利制造的西装、衬衫和针对男士量身定制的服装:Lanieri
2018/04/08 全球购物
Yummie官方网站:塑身衣和衣柜必需品
2019/10/29 全球购物
编程实现当输入某产品代码则打印出该产品记录的功能
2014/05/03 面试题
2014年情人节活动方案
2014/02/16 职场文书
《有趣的发现》教学反思
2014/04/15 职场文书
研究生就业推荐表导师评语
2014/12/31 职场文书
党小组鉴定意见
2015/06/02 职场文书
工作违纪的检讨书范文
2019/07/09 职场文书
Pygame Time时间控制的具体使用详解
2021/11/17 Python
Windows Server 2016 配置 IIS 的详细步骤
2022/04/28 Servers
PYTHON InceptionV3模型的复现详解
2022/05/06 Python