vue style width a href动态拼接问题的解决


Posted in Javascript onAugust 07, 2020

style width 这个问题 折磨了我一个上午了 好惭愧

因为项目涉及到 进度条 所以必须用行内样式 style

用过vue的都知道 vue中style的用法

大众用法

:style=" { width:30px } "

但是现在涉及到拼接了 直接上代码了

vue style width a href动态拼接问题的解决

其中list是我data循环的数据 这是一个比例的关系

公开是拼接的时候 一直是报错的 一直出现文本 ‘ } ' = > 类似这些的东西

很显然 是拼接的问题 于是继续拼接 但是还是变着花样地出现这些鬼东西

于是发现 只要把花括号去掉 拼接上%就可以了

虽然浪费了很多时间 但是还是有收获的!

下面的这个是a的href 跳转时候拼接id的

vue style width a href动态拼接问题的解决

这个没啥好说的 看看图片就差不多理解了 不过我怎么觉得vue的拼接和普通html不一样啊

补充知识:问题:vue.js a标签href里有变量,函数拼接问题

正确格式:

<a :href ="'http://search.jd.com/Search?enc=utf-8&keyword='+keyWord+'&page='+Math.ceil(record.skuRank/60)+'.html'">跳转</a>

注意点:

1.href前面要加“:”

2.字符串要用单引号“ ' ”包住

3.句尾要加“.html”

以上这篇vue style width a href动态拼接问题的解决就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 有用的脚本函数
May 07 Javascript
JS简单操作select和dropdownlist实例
Nov 26 Javascript
jQuery实现的向下图文信息滚动效果
May 03 Javascript
JavaScript中的some()方法使用详解
Jun 09 Javascript
微信小程序 底部导航栏目开发资料
Dec 05 Javascript
原生js实现简单的模态框示例
Sep 08 Javascript
vue2.0 自定义 饼状图 (Echarts)组件的方法
Mar 02 Javascript
Vue中Table组件Select的勾选和取消勾选事件详解
Mar 19 Javascript
原生JS使用Canvas实现拖拽式绘图功能
Jun 05 Javascript
layui实现下拉框三级联动
Jul 26 Javascript
微信小程序报错: thirdScriptError的错误问题
Jun 19 Javascript
antd design table更改某行数据的样式操作
Oct 31 Javascript
vue 保留两位小数 不能直接用toFixed(2) 的解决
Aug 07 #Javascript
JavaScript实现与web通信的方法详解
Aug 07 #Javascript
解决Vue-Router升级导致的Uncaught (in promise)问题
Aug 07 #Javascript
JavaScript实现多文件下载方法解析
Aug 07 #Javascript
基于javascript的无缝滚动动画1
Aug 07 #Javascript
vue-router重写push方法,解决相同路径跳转报错问题
Aug 07 #Javascript
手把手带你搭建一个node cli的方法示例
Aug 07 #Javascript
You might like
php中处理模拟rewrite 效果
2006/12/09 PHP
php 正则表达式小结
2009/08/31 PHP
php的RSA加密解密算法原理与用法分析
2020/01/23 PHP
dojo 之基础篇(三)之向服务器发送数据
2007/03/24 Javascript
js onpropertychange输入框 事件获取属性
2009/03/26 Javascript
capacityFixed 基于jquery的类似于新浪微博新消息提示的定位框
2011/05/24 Javascript
jQuery制作圣诞主题页面 更像是爱情影集
2016/08/10 Javascript
jQuery 遍历map()方法详解
2016/11/04 Javascript
微信小程序 122100版本更新问题解决方案
2016/12/22 Javascript
JavaScript html5利用FileReader实现上传功能
2020/03/27 Javascript
jQuery Masonry瀑布流布局神器使用详解
2017/05/25 jQuery
基于node.js之调试器详解
2017/08/22 Javascript
node.js博客项目开发手记
2018/03/16 Javascript
webstrom Debug 调试vue项目的方法步骤
2018/07/17 Javascript
JS闭包经典实例详解
2018/12/20 Javascript
vue项目创建并引入饿了么elementUI组件的步骤
2019/04/11 Javascript
java实现单链表增删改查的实例代码详解
2019/08/30 Javascript
vue多页面项目中路由使用history模式的方法
2019/09/23 Javascript
python抽象基类用法实例分析
2015/06/04 Python
python3.7简单的爬虫实例详解
2019/07/08 Python
python实现网站微信登录的示例代码
2019/09/18 Python
Python的对象传递与Copy函数使用详解
2019/12/26 Python
Anaconda详细安装步骤图文教程
2020/11/12 Python
AmazeUI 按钮交互的实现示例
2020/08/24 HTML / CSS
印度手工编织服装和家居用品商店:Fabindi
2019/10/07 全球购物
机电一体化专业应届生求职信
2013/11/27 职场文书
会议开场欢迎词
2014/01/15 职场文书
大学生学习2014全国两会心得体会
2014/03/13 职场文书
护理专业自荐书
2014/06/04 职场文书
市场营销专业毕业生求职信
2014/07/21 职场文书
2016护理专业求职自荐书
2016/01/28 职场文书
《地震中的父与子》教学反思
2016/02/16 职场文书
Python基础之元编程知识总结
2021/05/23 Python
Python实现照片卡通化
2021/12/06 Python
pandas时间序列之pd.to_datetime()的实现
2022/06/16 Python
MySQL外键约束(Foreign Key)案例详解
2022/06/28 MySQL