用v-html解决Vue.js渲染中html标签不被解析的问题


Posted in Javascript onDecember 14, 2016

前言

最近在工作中遇到一个问题,在网页中后台传来的json数据中包含html标签,将该json数据绑定到Vue.js中对象中,对该对象进行for循环,发现数据中的html标签不能被解析,而是当作字符显示出来。

问题如下所示:

用v-html解决Vue.js渲染中html标签不被解析的问题

解决方法:

Vue.js中提供了v-html这个指令来解决这个问题,或者对数据对象使用{{{vm.data}}}三个大括号来包裹对象,就可以正常解析了。

代码改动如下:

用v-html解决Vue.js渲染中html标签不被解析的问题

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家都 学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流。

Javascript 相关文章推荐
JavaScript省市联动实现代码
Feb 15 Javascript
$.extend 的一个小问题
Jun 18 Javascript
Underscore.js 1.3.3 中文注释翻译说明
Jun 25 Javascript
异步JavaScript编程中的Promise使用方法
Jul 28 Javascript
分享jQuery插件的学习笔记
Jan 14 Javascript
AngularJS ngModel实现指令与输入直接的数据通信
Sep 21 Javascript
Javascript中this绑定的3种方法与比较
Oct 13 Javascript
vue+vuex+axios+echarts画一个动态更新的中国地图的方法
Dec 19 Javascript
JS实现星星海特效
Dec 24 Javascript
uni-app使用微信小程序云函数的步骤示例
May 22 Javascript
js Proxy的原理详解
May 25 Javascript
React 高阶组件HOC用法归纳
Jun 13 Javascript
关于BootStrap modal 在IOS9中不能弹出的解决方法(IOS 9 bootstrap modal ios 9 noticework)
Dec 14 #Javascript
实例解析angularjs的filter过滤器
Dec 14 #Javascript
微信小程序 input输入框控件详解及实例(多种示例)
Dec 14 #Javascript
javascript中对象的定义、使用以及对象和原型链操作小结
Dec 14 #Javascript
JS中使用new Date(str)创建时间对象不兼容firefox和ie的解决方法(两种)
Dec 14 #Javascript
javascript中的try catch异常捕获机制用法分析
Dec 14 #Javascript
微信小程序 scroll-view组件实现列表页实例代码
Dec 14 #Javascript
You might like
php中取得URL的根域名的代码
2011/03/23 PHP
php中preg_match的isU代表什么意思
2015/10/01 PHP
Swoole源码中如何查询Websocket的连接问题详解
2020/08/30 PHP
Hutia 的 JS 代码集
2006/10/24 Javascript
谷歌浏览器 insertCell与appendChild的区别
2009/02/12 Javascript
jquery 按键盘上的enter事件
2014/05/11 Javascript
jQuery 隐藏和显示 input 默认值示例
2014/06/03 Javascript
简介JavaScript中的sub()方法的使用
2015/06/08 Javascript
Underscore源码分析
2015/12/30 Javascript
使用JavaScript获取Request中参数的值方法
2016/09/27 Javascript
微信小程序 页面跳转传参详解
2016/10/28 Javascript
微信小程序购物商城系统开发系列-工具篇的介绍
2016/11/21 Javascript
在 Angular-cli 中使用 simple-mock 实现前端开发 API Mock 接口数据模拟功能的方法
2018/11/28 Javascript
关于vue的npm run dev和npm run build的区别介绍
2019/01/14 Javascript
JQuery中queue方法用法示例
2019/01/31 jQuery
jQuery实现动态添加和删除input框实例代码
2019/03/26 jQuery
vue表单验证你真的会了吗?vue表单验证(form)validate
2019/04/07 Javascript
微信小程序 swiper 组件遇到的问题及解决方法
2019/05/26 Javascript
vue element自定义表单验证请求后端接口验证
2019/12/11 Javascript
[01:03:59]2018DOTA2亚洲邀请赛3月30日 小组赛B组VGJ.T VS Secret
2018/03/31 DOTA
Python文件去除注释的方法
2015/05/25 Python
Pandas标记删除重复记录的方法
2018/04/08 Python
python程序变成软件的实操方法
2019/06/24 Python
python中下标和切片的使用方法解析
2019/08/27 Python
python  logging日志打印过程解析
2019/10/22 Python
pygame实现飞机大战
2020/03/11 Python
解决redis与Python交互取出来的是bytes类型的问题
2020/07/16 Python
python递归函数用法详解
2020/10/26 Python
python Zmail模块简介与使用示例
2020/12/19 Python
比驿:全球酒店比价网
2018/06/20 全球购物
乌克兰在线电子产品商店:MTA
2019/11/14 全球购物
教师自我评价范文
2013/12/16 职场文书
应届实习生的自我评价范文
2014/01/05 职场文书
应届生求职信范文
2014/05/26 职场文书
本科毕业论文致谢词
2015/05/14 职场文书
Python绘制散点图之可视化神器pyecharts
2022/07/07 Python