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 相关文章推荐
Jquery插件之打造自定义的select标签
Nov 30 Javascript
JS模块与命名空间的介绍
Mar 22 Javascript
登陆成功后自动计算秒数执行跳转
Jan 23 Javascript
jQuery中before()方法用法实例
Dec 25 Javascript
JavaScript里四舍五入函数round用法实例
Apr 06 Javascript
js实现顶部可折叠的菜单工具栏效果实例
May 09 Javascript
解决JS请求服务器gbk文件乱码的问题
Oct 16 Javascript
javascript DIV实现跟随鼠标移动
Mar 19 Javascript
微信小程序 解决swiper不显示图片的方法
Jan 04 Javascript
vue.js中npm安装教程图解
Apr 10 Javascript
GOJS+VUE实现流程图效果
Dec 01 Javascript
JavaScript实现HTML导航栏下拉菜单
Nov 25 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
phpBB BBcode处理的漏洞
2006/10/09 PHP
Php图像处理类代码分享
2012/01/19 PHP
php实现三级级联下拉框
2016/04/17 PHP
PHP实现的数组和XML文件相互转换功能示例
2018/03/15 PHP
php使用mysqli和pdo扩展,测试对比mysql数据库的执行效率完整示例
2019/05/09 PHP
laravel 解决多库下的DB::transaction()事务失效问题
2019/10/21 PHP
PHP生成随机密码4种方法及性能对比
2020/12/11 PHP
js的Prototype属性解释及常用方法
2014/05/08 Javascript
JS获取当前日期时间并定时刷新示例
2021/03/04 Javascript
详解JavaScript中循环控制语句的用法
2015/06/03 Javascript
js实现简单的验证码
2015/12/25 Javascript
微信小程序 解决请求服务器手机预览请求不到数据的方法
2017/01/04 Javascript
微信小程序 页面跳转如何实现传值
2017/04/05 Javascript
ES6 Object.assign()的用法及其使用
2020/01/18 Javascript
深入理解python函数递归和生成器
2016/06/06 Python
Python使用回溯法子集树模板获取最长公共子序列(LCS)的方法
2017/09/08 Python
Python实现按当前日期(年、月、日)创建多级目录的方法
2018/04/26 Python
mac安装scrapy并创建项目的实例讲解
2018/06/13 Python
详谈Python 窗体(tkinter)表格数据(Treeview)
2018/10/11 Python
图文详解python安装Scrapy框架步骤
2019/05/20 Python
简单了解python gevent 协程使用及作用
2019/07/22 Python
Pandas聚合运算和分组运算的实现示例
2019/10/17 Python
Python字符串格式化输出代码实例
2019/11/22 Python
python实现的批量分析xml标签中各个类别个数功能示例
2019/12/30 Python
python框架flask入门之环境搭建及开启调试
2020/06/07 Python
html5组织文档结构_动力节点Java学院整理
2017/07/11 HTML / CSS
移动端Html5页面生成图片解决方案
2018/08/07 HTML / CSS
原生canvas制作画图小工具的踩坑和爬坑
2020/06/09 HTML / CSS
美国知名的摄影器材销售网站:Adorama
2017/02/01 全球购物
介绍下java.util.Arrays类
2012/10/16 面试题
教师的实习自我鉴定
2013/12/17 职场文书
优秀管理者获奖感言
2014/02/17 职场文书
《独坐敬亭山》教学反思
2014/04/08 职场文书
就业协议书范本
2014/10/08 职场文书
Laravel中获取IP的真实地理位置
2021/04/01 PHP
pandas DataFrame.shift()函数的具体使用
2021/05/24 Python