Vue系列之指令 v-html
v-html 是 Vue.js 中的一个指令，它用于设置元素的 innerHTML。这意味着它会替换元素内的 HTML 代码，并对其进行 Vue 的模板编译。
警告：由于它会渲染 HTML 内容，所以可能会导致跨站脚本攻击 (XSS)。只在可靠内容上使用 v-html，永不用在用户提交的内容上。
用法：
<div v-html="rawHtml"></div>在这个例子中，rawHtml 是一个字符串，可以包含 HTML 标记。这个字符串将会被渲染为 HTML。
示例代码：
<template>
<div v-html="dynamicContent"></div>
</template>
<script>
export default {
data() {
return {
dynamicContent: '<p>This will be rendered as HTML</p>'
}
}
}
</script>在这个例子中，<div> 的内容将会被设置为 <p>This will be rendered as HTML</p>。
注意：如果 dynamicContent 是用户提供的内容，请务必对其进行清洗，以防止 XSS 攻击。
评论已关闭