Vue实现将数据库中带html标签的内容输出(原始HTML(Raw HTML))


Posted in Javascript onOctober 28, 2019

原始 HTML(Raw HTML)

双花括号语法,会将数据中的 HTML 转为纯文本后再进行插值。为了输出真正的 HTML,你需要使用 v-html 指令:

<p>使用双花括号语法:{{ rawHtml }}</p>
<p>使用 v-html 指令:<span v-html="rawHtml"></span></p>

使用双花括号语法:<span style="color: red">This should be red.</span>

使用 v-html 指令:This should be red.

span 中的内容,将会被替换为 rawHtml 属性的值,并且作为原始 HTML 插入 - 会忽略解析属性值中的数据绑定。请注意,无法使用v-html来组合局部模板,这是因为 Vue 不是基于字符串(string-based)的模板引擎。反之,对于用户界面(UI),组件更适合作为可重用和可组合的基本单位。

在网站中动态渲染任意的 HTML 是非常危险的,因为这很容易导致网站受到 XSS 攻击。请只对可信内容使用 HTML 插值,绝对不要对用户提供的内容使用 HTML 插值。

以上这篇Vue实现将数据库中带html标签的内容输出(原始HTML(Raw HTML))就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
基于jquery的给文章加入关键字链接
Oct 26 Javascript
jquery获取div宽度的实现思路与代码
Jan 13 Javascript
jquery如何实现锚点链接之间的平滑滚动
Dec 02 Javascript
两种不同的方法实现js对checkbox进行全选和反选
May 13 Javascript
JavaScript将数组转换成CSV格式的方法
Mar 19 Javascript
js实现异步循环实现代码
Feb 16 Javascript
Vue底层实现原理总结
Feb 17 Javascript
详解vue2.0 不同屏幕适配及px与rem转换问题
Feb 23 Javascript
微信小程序实现省市区三级地址选择
Jun 21 Javascript
详解webpack打包vue项目之后生成的dist文件该怎么启动运行
Sep 06 Javascript
javascript实现简易计算器功能
Sep 23 Javascript
Vue的列表之渲染,排序,过滤详解
Feb 24 Vue.js
js实现图片无缝循环轮播
Oct 28 #Javascript
Vue 实现html中根据类型显示内容
Oct 28 #Javascript
vue中动态select的使用方法示例
Oct 28 #Javascript
js实现坦克移动小游戏
Oct 28 #Javascript
vue 实现走马灯效果
Oct 28 #Javascript
JS实现json数组排序操作实例分析
Oct 28 #Javascript
VUE渲染后端返回含有script标签的html字符串示例
Oct 28 #Javascript
You might like
PHP static局部静态变量和全局静态变量总结
2014/03/02 PHP
php警告Creating default object from empty value 问题的解决方法
2014/04/02 PHP
PHP实现操作redis的封装类完整实例
2015/11/14 PHP
PHP加MySQL消息队列深入理解
2021/02/27 PHP
基于逻辑运算的简单权限系统(实现) JS 版
2007/03/24 Javascript
JavaScript中的对象化编程
2008/01/16 Javascript
javascript与有限状态机详解
2014/05/08 Javascript
Javascript基础教程之数组 array
2015/01/18 Javascript
JavaScript实现找质数代码分享
2015/03/24 Javascript
JavaScript实现点击单元格改变背景色的方法
2016/02/12 Javascript
详解PHP后期静态绑定分析与应用
2018/03/21 Javascript
layui table表格数据的新增,修改,删除,查询,双击获取行数据方式
2019/11/14 Javascript
vue data对象重新赋值无效(未更改)的解决方式
2020/07/24 Javascript
在 Django/Flask 开发服务器上使用 HTTPS
2014/07/03 Python
Python构造自定义方法来美化字典结构输出的示例
2016/06/16 Python
pycharm的console输入实现换行的方法
2019/01/16 Python
Python 图像处理: 生成二维高斯分布蒙版的实例
2019/07/04 Python
python利用datetime模块计算程序运行时间问题
2020/02/20 Python
pandas中ix的使用详细讲解
2020/03/09 Python
python实现俄罗斯方块游戏(改进版)
2020/03/13 Python
python dict乱码如何解决
2020/06/07 Python
互斥锁解决 Python 中多线程共享全局变量的问题(推荐)
2020/09/28 Python
Python3中FuzzyWuzzy库实例用法
2020/11/18 Python
世界上最大的罕见唱片、CD和音乐纪念品网上商店:991.com
2018/05/03 全球购物
澳大利亚在线生活方式商店:Mytopia
2018/07/08 全球购物
牛津在线药房:Oxford Online Pharmacy
2020/11/16 全球购物
Delphi软件工程师试题
2013/01/29 面试题
师范毕业生求职自荐信
2013/09/25 职场文书
机电专业毕业生推荐信
2013/11/10 职场文书
党风廉设责任书
2014/04/16 职场文书
节能环保家庭事迹材料
2014/08/27 职场文书
水电工岗位职责
2015/02/14 职场文书
甲午风云观后感
2015/06/02 职场文书
2016年综治宣传月活动宣传标语口号
2016/03/16 职场文书
关于企业的执行力标语大全
2020/01/06 职场文书
前端canvas中物体边框和控制点的实现示例
2022/08/05 Javascript