Vue的HTML插入——v-html指令

有时我们希望将数据作为HTML代码插入到HTML模板中,而不是以纯文本的形式显示。在这种情况下,我们需要使用Vue.js的v-html指令:

html 复制代码
<template>
  <div>
    <p>纯文本: {{ rawText }}</p>
    <p>属性: <span v-html="rawHtml"></span></p>
  </div>
</template>

<script>
export default {
  data() {
    return {
      rawText: "这是一段纯文本",
      rawHtml: "<a href='https://baidu.com'> baidu </a>"
    };
  }
};
</script>

点击baidu后:跳转到了新的标签页百度

相关推荐
谢尔登38 分钟前
Monorepo 架构
前端·arcgis·架构
栀秋6661 小时前
你会先找行还是直接拍平?两种二分策略你Pick哪个?
前端·javascript·算法
漂流瓶jz1 小时前
PostCSS完全指南:功能/配置/插件/SourceMap/AST/插件开发/自定义语法
前端·javascript·css
xhxxx1 小时前
传统工具调用太痛苦?LangChain 一键打通 LLM 与真实世界
前端·langchain·llm
南山安1 小时前
LangChain学习:Memory实战——让你的大模型记住你
前端·javascript·langchain
武昌库里写JAVA2 小时前
iview-CRUD模板
vue.js·spring boot·sql·layui·课程设计
BD_Marathon2 小时前
Promise基础语法
开发语言·前端·javascript
BOF_dcb2 小时前
网页设计DW
前端
千寻girling3 小时前
计算机组成原理-全通关源码-实验(通关版)---头歌平台
前端·面试·职场和发展·typescript·node.js
karshey3 小时前
【前端】解决:点击一个button,发现不触发点击事件
前端