用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学习笔记 用jquery实现无刷新登录
Aug 08 Javascript
js模仿windows桌面图标排列算法具体实现(附图)
Jun 16 Javascript
使用jQuery异步加载 JavaScript脚本解决方案
Apr 20 Javascript
包含中国城市的javascript对象实例
Aug 03 Javascript
一道JS前端闭包面试题解析
Dec 25 Javascript
js 动态添加元素(div、li、img等)及设置属性的方法
Jul 19 Javascript
JavaScript & jQuery完美判断图片是否加载完毕
Jan 08 Javascript
二维码图片生成器QRCode.js简单介绍
Aug 18 Javascript
使用JavaScript中的lodash编写双色球效果
Jun 24 Javascript
Vue项目自动转换 px 为 rem的实现方法
Oct 29 Javascript
浅谈Vue.set实际上是什么
Oct 17 Javascript
JavaScript将数组转换为链表的方法
Feb 16 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
Yii框架form表单用法实例
2014/12/04 PHP
JavaScript的面向对象(一)
2006/11/09 Javascript
比较详细的javascript对象的property和prototype是什么一种关系
2007/08/06 Javascript
javascript学习笔记(一) 在html中使用javascript
2012/06/18 Javascript
js下拉框二级关联菜单效果代码具体实现
2013/08/03 Javascript
教你如何使用node.js制作代理服务器
2014/11/26 Javascript
浅谈jQuery构造函数分析
2015/05/11 Javascript
js实现Select列表各项上移和下移的方法
2015/08/14 Javascript
基于jQuery全屏焦点图左右切换插件responsiveslides
2015/09/07 Javascript
jquery实现的table排序功能示例
2017/03/10 Javascript
vue-router 手势滑动触发返回功能
2018/09/30 Javascript
vue.js中使用echarts实现数据动态刷新功能
2019/04/16 Javascript
[05:34]2014DOTA2国际邀请赛中国区预选赛精彩TOPPLAY第二弹
2014/06/25 DOTA
Python程序设计入门(2)变量类型简介
2014/06/16 Python
Django静态资源URL STATIC_ROOT的配置方法
2014/11/08 Python
python实现带验证码网站的自动登陆实现代码
2015/01/12 Python
基于python list对象中嵌套元组使用sort时的排序方法
2018/04/18 Python
Python实现的绘制三维双螺旋线图形功能示例
2018/06/23 Python
Python异常的检测和处理方法
2018/10/26 Python
python异常处理和日志处理方式
2019/12/24 Python
Keras使用tensorboard显示训练过程的实例
2020/02/15 Python
Python pyautogui模块实现鼠标键盘自动化方法详解
2020/02/17 Python
在服务器上安装python3.8.2环境的教程详解
2020/04/26 Python
简单介绍一下pyinstaller打包以及安全性的实现
2020/06/02 Python
Python flask框架端口失效解决方案
2020/06/04 Python
python代码能做成软件吗
2020/07/24 Python
Pycharm学生免费专业版安装教程的方法步骤
2020/09/24 Python
对pytorch中x = x.view(x.size(0), -1) 的理解说明
2021/03/03 Python
HTML5单页面手势滑屏切换原理分析
2017/07/10 HTML / CSS
Richards网上商店:当代时尚,遍布巴西
2019/11/03 全球购物
财会专业大学生求职信
2014/09/26 职场文书
工厂标语大全
2014/10/06 职场文书
前台岗位职责
2015/02/13 职场文书
学雷锋献爱心倡议书
2015/04/27 职场文书
python中if和elif的区别介绍
2021/11/07 Python
利用Python多线程实现图片下载器
2022/03/25 Python