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 相关文章推荐
使用EXT实现无刷新动态调用股票信息
Nov 01 Javascript
原生js写的放大镜效果
Aug 22 Javascript
Jquery实现带动画效果的经典二级导航菜单
Mar 22 Javascript
JS对img进行操作(换图片/切图/轮换/停止)
Apr 17 Javascript
Javascript事件实例详解
Nov 06 Javascript
表单序列化与jq中的serialize使用示例
Feb 21 Javascript
jQuery实现的简单分页示例
Jun 01 Javascript
jQuery插件JWPlayer视频播放器用法实例分析
Jan 11 Javascript
js读取json文件片段中的数据实例
Mar 09 Javascript
什么是Vue.js框架 为什么选择它?
Oct 17 Javascript
js变量声明var使用与不使用的区别详解
Jan 21 Javascript
关于JS模块化的知识点分享
Oct 16 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
星际争霸 Starcraft 秘技补丁
2020/03/14 星际争霸
PHP中路径问题的解决方案
2006/10/09 PHP
PHP获取文件绝对路径的代码(上一级目录)
2011/05/29 PHP
ThinkPHP3.1新特性之对Ajax的支持更加完善
2014/06/19 PHP
[原创]js获取数组任意个不重复的随机数组元素
2010/03/15 Javascript
document节点对象的获取方式示例介绍
2013/12/24 Javascript
JS的document.all函数使用示例
2013/12/30 Javascript
JS图片自动轮换效果实现思路附截图
2014/04/30 Javascript
jQuery+jRange实现滑动选取数值范围特效
2015/03/14 Javascript
数据分析软件之FineReport教程:[5]参数界面JS(全)
2015/08/13 Javascript
jQuery xml字符串的解析、读取及查找方法
2016/03/01 Javascript
Vue2.0用户权限控制解决方案的示例
2018/02/10 Javascript
vue-cli整合vuex的时候,修改actions和mutations,实现热部署的方法
2018/09/19 Javascript
vue之组件内监控$store中定义变量的变化详解
2019/11/08 Javascript
Vue中常用rules校验规则(实例代码)
2019/11/14 Javascript
vue实现列表拖拽排序的功能
2020/11/02 Javascript
在Django的模板中使用认证数据的方法
2015/07/23 Python
简单讲解Python中的字符串与字符串的输入输出
2016/03/13 Python
详解Python中的type和object
2018/08/15 Python
python3.6.3转化为win-exe文件发布的方法
2018/10/31 Python
Tensorflow轻松实现XOR运算的方式
2020/02/03 Python
Pycharm 安装 idea VIM插件的图文教程详解
2020/02/21 Python
python,Java,JavaScript实现indexOf
2020/09/09 Python
linux系统下pip升级报错的解决方法
2021/01/31 Python
解决import tensorflow导致jupyter内核死亡的问题
2021/02/06 Python
浅谈html5 video 移动端填坑记
2018/01/15 HTML / CSS
AURALog面试题软件测试方面
2013/10/22 面试题
优秀的毕业生的自我评价
2013/12/12 职场文书
预备党员转正思想汇报
2014/01/12 职场文书
总经理司机岗位职责
2014/02/06 职场文书
扩大国家免疫规划实施方案
2014/03/21 职场文书
天那边观后感
2015/06/09 职场文书
毕业生就业推荐表自我鉴定
2019/06/20 职场文书
MySQL 数据类型选择原则
2021/05/27 MySQL
sql通过日期判断年龄函数的示例代码
2021/07/16 SQL Server
python语言中pandas字符串分割str.split()函数
2022/08/05 Python