Vue解析带html标签的字符串为dom的实例


Posted in Javascript onNovember 13, 2019

1.场景描述

Vue解析带html标签的字符串为dom的实例

如上接口中,content字段:

content:"<p>这是内容</p>"

需要在网页中现实如下效果:

Vue解析带html标签的字符串为dom的实例

2.解决方法

v-html

<div class="blog-content" v-html="curblog.content">
</div>

v-html可以操作元素中的HTML标签,效果类似于jquery里的 .html()方法,在不安全的页面比如注册或者登陆页面千万不要用这个指令。因为会出现XSS攻击。所以千万不要用。官网提示:

在不安全的页面比如注册或者登陆页面千万不要用这个指令。因为会出现 XSS攻击。所以千万不要用。

以上这篇Vue解析带html标签的字符串为dom的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
优秀js开源框架-jQuery使用手册(1)
Mar 10 Javascript
面向对象的Javascript之一(初识Javascript)
Jan 20 Javascript
JS 屏蔽键盘不可用与鼠标右键不可用的方法
Nov 18 Javascript
jQuery中:visible选择器用法实例
Dec 30 Javascript
js判断手机端(Android手机还是iPhone手机)
Jul 22 Javascript
jQuery实现动画效果circle实例
Aug 06 Javascript
jQuery实现鼠标选中文字后弹出提示窗口效果【附demo源码】
Sep 05 Javascript
JavaScript中for循环的几种写法与效率总结
Feb 03 Javascript
Vue波纹按钮组件制作
Apr 30 Javascript
微信小程序之事件交互操作实例分析
Dec 03 Javascript
详解搭建一个vue-cli的移动端H5开发模板
Jan 17 Javascript
将Vue组件库更换为按需加载的方法步骤
May 06 Javascript
vue props对象validator自定义函数实例
Nov 13 #Javascript
微信小程序获取当前位置和城市名
Nov 13 #Javascript
使用Promise封装小程序wx.request的实现方法
Nov 13 #Javascript
微信小程序wx.request的简单封装
Nov 13 #Javascript
vue使用prop可以渲染但是打印台报错的解决方式
Nov 13 #Javascript
highcharts.js数据绑定方式代码实例
Nov 13 #Javascript
vue prop属性传值与传引用示例
Nov 13 #Javascript
You might like
深入理解PHP中的Session和Cookie
2013/06/21 PHP
PHP实现统计所有字符在字符串中出现次数的方法
2017/10/17 PHP
jQuery与其它库冲突的解决方法
2010/06/25 Javascript
Jquery ui css framework
2010/06/28 Javascript
jquery插件制作 图片走廊 gallery
2012/08/17 Javascript
jquery动态加载js三种方法实例
2013/08/03 Javascript
Jquery中val()表单取值赋值的实例代码
2013/08/15 Javascript
Javascript中引用示例介绍
2014/02/21 Javascript
用js一次改变多个input的readonly属性值的方法
2014/06/11 Javascript
nodejs中实现sleep功能实例
2015/03/24 NodeJs
javascript实现手机震动API代码
2015/08/05 Javascript
Bootstrap组件系列之福利篇几款好用的组件(推荐)
2016/06/23 Javascript
Angular2中Bootstrap界面库ng-bootstrap详解
2016/10/18 Javascript
vue.js初学入门教程(2)
2016/11/07 Javascript
AngularJS 防止页面闪烁的方法
2017/03/09 Javascript
解决vue中对象属性改变视图不更新的问题
2018/02/23 Javascript
Angular如何在应用初始化时运行代码详解
2018/06/11 Javascript
实例讲解vue源码架构
2019/01/24 Javascript
使用Layer组件弹出多个对话框(非嵌套)与关闭及刷新的例子
2019/09/25 Javascript
解决elementUI 切换tab后 el_table 固定列下方多了一条线问题
2020/07/19 Javascript
解决vue的touchStart事件及click事件冲突问题
2020/07/21 Javascript
Javascript confirm多种使用方法解析
2020/09/25 Javascript
Python新手在作用域方面经常容易碰到的问题
2015/04/03 Python
Python实现利用最大公约数求三个正整数的最小公倍数示例
2017/09/30 Python
Python实现基于POS算法的区块链
2018/08/07 Python
Python实现的读取/更改/写入xml文件操作示例
2018/08/30 Python
Python3爬虫之urllib携带cookie爬取网页的方法
2018/12/28 Python
用Python绘制漫步图实例讲解
2020/02/26 Python
深入浅析python 中的self和cls的区别
2020/06/20 Python
Django自带用户认证系统使用方法解析
2020/11/12 Python
怀旧收藏品和经典纪念品:Betty’s Attic
2018/08/29 全球购物
创业计划书之干洗店
2019/09/10 职场文书
如何用PHP实现多线程编程
2021/05/26 PHP
Python激活Anaconda环境变量的详细步骤
2021/06/08 Python
MySQL分区表管理命令汇总
2022/03/21 MySQL
CSS元素定位之通过元素的标签或者元素的id、class属性定位详解
2022/09/23 HTML / CSS