用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 相关文章推荐
jQuery 连续列表实现代码
Dec 21 Javascript
20个非常棒的 jQuery 幻灯片插件和教程分享
Aug 23 Javascript
向当前style sheet中插入一个新的style实现方法
Apr 01 Javascript
jQuery实现对无序列表的排序功能(附demo源码下载)
Jun 25 Javascript
vue.js+boostrap项目实践(案例详解)
Sep 21 Javascript
深入理解jQuery.data() 的实现方式
Nov 30 Javascript
jQuery根据ID、CLASS、等获取对象的实例
Dec 04 Javascript
jQuery弹出层插件popShow用法示例
Jan 23 Javascript
详解vue.js2.0父组件点击触发子组件方法
May 10 Javascript
vue表单绑定实现多选框和下拉列表的实例
Aug 12 Javascript
解决Vue axios post请求,后台获取不到数据的问题方法
Aug 11 Javascript
vue实现登录功能
Dec 31 Vue.js
关于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编程效率的53个要点(经验小结)
2010/09/04 PHP
php中字符集转换iconv函数使用总结
2014/10/11 PHP
微信支付开发订单查询实例
2016/07/12 PHP
PHP实现图片批量打包下载功能
2017/03/01 PHP
php常用经典函数集锦【数组、字符串、栈、队列、排序等】
2019/08/23 PHP
PHP常用函数之根据生日计算年龄功能示例
2019/10/21 PHP
jQuery弹出层插件简化版代码下载
2008/10/16 Javascript
javascript Object与Function使用
2010/01/11 Javascript
jQuery EasyUI API 中文文档 - ComboGrid 组合表格
2011/10/13 Javascript
js中判断对象是否为空的三种实现方法
2013/12/23 Javascript
动态的创建一个元素createElement及删除一个元素
2014/01/24 Javascript
给html超链接设置事件不使用href来完成跳
2014/04/20 Javascript
纯JavaScript实现的兼容各浏览器的添加和移除事件封装
2015/03/28 Javascript
jquery实现手风琴效果
2015/11/20 Javascript
js基于cookie方式记住返回页面用法示例
2016/05/27 Javascript
jQuery插件jqGrid动态获取列和列字段的方法
2017/03/03 Javascript
详解webpack进阶之插件篇
2017/07/06 Javascript
jQuery Validate格式验证功能实例代码(包括重名验证)
2017/07/18 jQuery
ES6中Class类的静态方法实例小结
2017/10/28 Javascript
js的函数的按值传递参数(实例讲解)
2017/11/16 Javascript
jQuery实现基本淡入淡出效果的方法详解
2018/09/05 jQuery
nuxt.js添加环境变量,区分项目打包环境操作
2020/11/06 Javascript
神经网络理论基础及Python实现详解
2017/12/15 Python
python 在某.py文件中调用其他.py内的函数的方法
2019/06/25 Python
Python argparse模块应用实例解析
2019/11/15 Python
Python tkinter和exe打包的方法
2020/02/05 Python
UGG雪地靴德国官网:UGG德国
2016/11/19 全球购物
4s店市场专员岗位职责
2014/04/09 职场文书
交通事故私了协议书
2014/04/16 职场文书
企业党员一句话承诺
2014/05/30 职场文书
乡镇综治宣传月活动总结
2014/07/02 职场文书
2015中秋节晚会主持词
2015/07/01 职场文书
坚持不是死撑,更重要的是心态
2019/08/19 职场文书
Django操作cookie的实现
2021/05/26 Python
python 字典和列表嵌套用法详解
2021/06/29 Python
【海涛教你打dota】体验一超神发条:咱是抢盾专业户
2022/04/01 DOTA