用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中this关键字使用方法详解
Mar 08 Javascript
编写高性能的JavaScript 脚本的加载与执行
Apr 19 Javascript
告诉你什么是javascript的回调函数
Sep 04 Javascript
js中document.write的那点事
Dec 12 Javascript
JavaScript实现找质数代码分享
Mar 24 Javascript
Javascript仿新浪游戏频道鼠标悬停显示子菜单效果
Aug 21 Javascript
Javascript中关于Array.filter()的妙用详解
Dec 04 Javascript
AngularJS 异步解决实现方法
Jun 12 Javascript
使用百度地图实现地图网格的示例
Feb 06 Javascript
Vue表单类的父子组件数据传递示例
May 03 Javascript
关于vue-router的那些事儿
May 23 Javascript
jquery+ajax实现上传图片并显示上传进度功能【附php后台接收】
Jun 06 jQuery
关于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
一个简单的自动发送邮件系统(三)
2006/10/09 PHP
PHP sleep()函数, usleep()函数
2016/08/25 PHP
ThinkPHP防止重复提交表单的方法实例分析
2018/05/10 PHP
Laravel find in set排序实例
2019/10/09 PHP
php7性能提升的原因详解
2019/10/13 PHP
Prototype 学习 工具函数学习($A方法)
2009/07/12 Javascript
解释&&和||在javascript中的另类用法
2014/07/28 Javascript
JavaScript代码复用模式详解
2014/11/07 Javascript
JavaScript中的console.group()函数详细介绍
2014/12/29 Javascript
JavaScript中setUTCMilliseconds()方法的使用详解
2015/06/12 Javascript
在页面中输出当前客户端时间javascript实例代码
2016/03/02 Javascript
JS实现可编辑的后台管理菜单功能【附demo源码下载】
2016/09/13 Javascript
微信小程序 教程之模板
2016/10/18 Javascript
BootStrap实现鼠标悬停下拉列表功能
2017/02/17 Javascript
json前后端数据交互相关代码
2018/09/19 Javascript
es6中Promise 对象基本功能与用法实例分析
2020/02/23 Javascript
vue使用nprogress加载路由进度条的方法
2020/06/04 Javascript
vue-router的hooks用法详解
2020/06/08 Javascript
ES5和ES6中类的区别总结
2020/12/21 Javascript
详解阿里Node.js技术文档之process模块学习指南
2021/01/04 Javascript
Python3.5 处理文本txt,删除不需要的行方法
2018/12/10 Python
Django 表单模型选择框如何使用分组
2019/05/16 Python
安装docker-compose的两种最简方法
2019/07/30 Python
kafka监控获取指定topic的消息总量示例
2019/12/23 Python
Python使用socketServer包搭建简易服务器过程详解
2020/06/12 Python
Python request post上传文件常见要点
2020/11/20 Python
泰国第一在线超市:Tops
2021/02/13 全球购物
高中打架检讨书
2014/02/13 职场文书
十八届三中全会学习方案
2014/02/16 职场文书
大学生职业生涯规划书汇总
2014/03/20 职场文书
铣工实训报告
2014/11/05 职场文书
班主任寄语2015
2015/02/26 职场文书
社交电商模式的兴起:这些新的商机千万别错过
2019/07/26 职场文书
详解GaussDB for MySQL性能优化
2021/05/18 MySQL
Python学习之os包使用教程详解
2022/03/21 Python
sentinel支持的redis高可用集群配置详解
2022/04/01 Redis