相关文章推荐
拉风的勺子  ·  WebView - .NET MAUI | ...·  2 月前    · 
想出国的钱包  ·  ASP.NET Core MVC 概述 | ...·  2 月前    · 
老实的橙子  ·  HTML、CSS 和 DOM ...·  2 月前    · 
安静的甘蔗  ·  解决ajax动态生成的数据无法获取html标 ...·  2 月前    · 
俊逸的炒饭  ·  使用python将html数据转换为json ...·  1 月前    · 
眉毛粗的草稿纸  ·  Python -更新现有json文件中的项 ...·  5 月前    · 
冲动的消炎药  ·  奇绩创坛秋季路演日 ...·  12 月前    · 
聪明伶俐的冰棍  ·  AttributeError: ...·  1 年前    · 
玉树临风的楼房  ·  powershell get ...·  1 年前    · 
朝气蓬勃的石榴  ·  Android PNG渐变背景图片失真问题 ...·  1 年前    · 
Code  ›  vue如何在页面上面输出html代码效果开发者社区
vue html代码
https://cloud.tencent.com/developer/article/1625427
沉着的作业本
1 年前
作者头像
刘金玉编程
0 篇文章

vue如何在页面上面输出html代码效果

前往专栏
腾讯云
备案 控制台
开发者社区
学习
实践
活动
专区
工具
TVP
文章/答案/技术大牛
写文章
社区首页 > 专栏 > 编程创造城市 > 正文

vue如何在页面上面输出html代码效果

发布 于 2020-05-08 18:08:34
3.6K 0
举报

一般情况下vue中使用双大括号{{这里是变量}} 这种形式输出变量的话,即使变量中是html代码,它输出的结果也会将html代码转为普通文本输出。

也就是说,使用普通的双大括号的形式,会将html代码输出时,将标签转码为html中对应到浏览器的代码。浏览器无法解析我们的HTML代码。(实际上在HTML输出到浏览器之前,已经将其进行了转码)。

但有时候,我们需要浏览器去解析输出我们的HTML代码。如果我们想要输出html代码效果,我们需要使用一个标签,在这个标签上面加上v-html属性,值为需要输出的html代码的变量。

例如:

<span v-html="这里是含有html代码的变量"></span>

这个贼关键哈!

点击展开阅读全文
文章分享自微信公众号:
编程创造城市
编程创造城市

扫码关注公众号

本文参与 腾讯云自媒体分享计划 ,欢迎热爱写作的你一起参与!

原始发表:2020-04-30 ,如有侵权请联系 cloudcommunity@tencent.com 删除

编程算法
html
登录 后参与评论
关于作者
0
文章
0
累计阅读量
0
获赞
前往专栏
关注 - 腾讯云 开发者 公众号
将获得
10元无门槛代金券
洞察腾讯核心技术
剖析业界实践案例
扫码关注腾讯云开发者
NEW
切换旧版
领券
  • 社区

    • 专栏文章
    • 阅读清单
    • 互动问答
    • 技术沙龙
    • 技术视频
    • 团队主页
    • 腾讯云TI平台
  • 活动

    • 自媒体分享计划
    • 邀请作者入驻
    • 自荐上首页
    • 技术竞赛
  • 资源

    • 技术周刊
    • 社区标签
    • 开发者手册
    • 开发者实验室
  • 关于

    • 社区规范
    • 免责声明
    • 联系我们
    • 友情链接

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

  • 域名注册
  • 云服务器
  • 区块链服务
  • 消息队列
  • 网络加速
  • 云数据库
  • 域名解析
  • 云存储
  • 视频直播

热门推荐

  • 人脸识别
  • 腾讯会议
  • 企业云
  • CDN加速
  • 视频通话
  • 图像分析
  • MySQL 数据库
  • SSL 证书
  • 语音识别

更多推荐

  • 数据安全
  • 负载均衡
  • 短信
  • 文字识别
  • 云点播
  • 商标注册
  • 小程序开发
  • 网站监控
  • 数据迁移

Copyright © 2013 - 2023 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有

深圳市腾讯计算机系统有限公司 ICP备案/许可证号: 粤B2-20090059 深公网安备号 44030502008569

腾讯云计算(北京)有限责任公司 京ICP证150476号 | 京ICP备11018762号 | 京公网安备号11010802020287

问题归档 专栏文章 快讯文章归档 关键词归档 开发者手册归档 开发者手册 Section 归档
 
推荐文章
拉风的勺子  ·  WebView - .NET MAUI | Microsoft Learn
2 月前
想出国的钱包  ·  ASP.NET Core MVC 概述 | Microsoft Learn
2 月前
老实的橙子  ·  HTML、CSS 和 DOM 中的空白符是如何处理的 - Web API | MDN
2 月前
安静的甘蔗  ·  解决ajax动态生成的数据无法获取html标签的属性值_ajax获取html标签数据
2 月前
俊逸的炒饭  ·  使用python将html数据转换为json开发者社区
1 月前
眉毛粗的草稿纸  ·  Python -更新现有json文件中的项 - 腾讯云开发者社区 - 腾讯云
5 月前
冲动的消炎药  ·  奇绩创坛秋季路演日 元宇宙创业项目备受关注_新闻频道_中国青年网
12 月前
聪明伶俐的冰棍  ·  AttributeError: ‘WebDriver‘ object has no attribute ‘w3c‘_webdriver' object has no attribute 'w3c-CS
1 年前
玉树临风的楼房  ·  powershell get current date time utc-掘金
1 年前
朝气蓬勃的石榴  ·  Android PNG渐变背景图片失真问题 - wanqi - 博客园
1 年前
今天看啥   ·   Py中国   ·   codingpro   ·   小百科   ·   link之家   ·   卧龙AI搜索
删除内容请联系邮箱 2879853325@qq.com
Code - 代码工具平台
© 2024 ~ 沪ICP备11025650号