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

在Vue中，v-html指令用于将HTML标记字符串动态地渲染为真实的HTML。这对于将服务器提供的内容直接插入到页面是非常有用的，但它可能会导致跨站脚本攻击（XSS），因此只有在你信任内容来源的情况下才应使用它。

以下是一个简单的例子，展示了如何使用v-html指令：




<template>
  <div v-html="rawHtml"></div>
</template>
 
<script>
export default {
  data() {
    return {
      rawHtml: '<p>这是<b>HTML</b>内容</p>'
    };
  }
};
</script>

在这个例子中，<div>元素的内容将被替换为rawHtml数据属性中的HTML字符串。请注意，不应将用户提供的内容直接用于v-html，以避免XSS攻击。

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

评论已关闭

推荐阅读