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

相关推荐
拾年2751 分钟前
深入理解 V8 引擎:从代码执行到垃圾回收的完整链路
前端·javascript·v8
Master_Azur5 分钟前
javaScript进阶
前端
markfeng86 分钟前
React入门教学
前端·react.js
ze_juejin7 分钟前
Object.defineProperty vs Proxy 对比总结
前端
卤蛋fg68 分钟前
高性能 Vue 甘特图:vxe-gantt 如何秒级渲染万级任务数据
vue.js
wing9815 分钟前
我的AI编程体验:从白嫖到付费,我为什么最终留下了Codex
前端·人工智能·程序员
京东云开发者25 分钟前
京东Taro Native框架静态布局直渲提速
前端
程序员小羊!26 分钟前
03JavaScript预备知识
前端
前端的阶梯26 分钟前
Cursor 开发 Python 项目完全指南
前端·人工智能·后端
艾伦野鸽ggg35 分钟前
JavaScript 基础语法速通
前端·javascript