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后:跳转到了新的标签页百度

相关推荐
程序员海军5 小时前
用了两年多 GPT,我最近开始换模型了,还折腾了个求职避坑 Agent
前端·人工智能·后端
zttbee6 小时前
echarts图表tooltip色块失效
前端·javascript·echarts
excel7 小时前
IndexNow:让搜索引擎更快发现网站更新的主动通知协议
前端·后端·架构
子兮曰8 小时前
CSS 复现 23 种设计风格:从拟物到液态玻璃的成本阶梯与兜底写法【实战】
前端·css·视觉设计
虚无境8 小时前
如何用AI帮我写出实用的插件
前端·javascript·ai编程
柳杉9 小时前
从数字化到数智化:3D 可视化大屏的下一个五年
前端·ai编程·数据可视化
濮水大叔9 小时前
函数式与对象式:前端架构的两种成本曲线
vue.js·react.js·函数式编程
风骏时光牛马10 小时前
从零到实战:AI全栈学习进阶路线
前端
FRing0310 小时前
JavaScript入门到精通二十六(变量提升、函数剩余参数、展开运算符、ES6箭头函数)
开发语言·前端·javascript·es6·箭头函数
用户3600555790010 小时前
Kestrel_VLLM - 15 · decode 优化四连击:19ms → 8ms
前端