v-html 和 v-text 有什么区别？答案

【问题标题】：What is the difference between v-html and v-text?v-html 和 v-text 有什么区别？
【发布时间】：2019-04-18 14:31:22
【问题描述】：

我使用 v-text 有以下代码：

<h1 v-text="content.title"></h1>

输出：

品牌名称是 B&C

所以我在上一行中使用 v-html 修复了它：

<h1 v-html="content.title"></h1>

输出：

品牌名称是 B&C

我的问题如下：为什么它可以使用 v-html 而不是 v-text ？我已经阅读了 Vue 文档，但我并不清楚其中的区别。

【问题讨论】：

【解决方案1】：

v-text 设置节点的textContent。 v-html 设置元素的innerHTML。 &amp; 是一个 HTML 实体。如果您希望解释和替换 HTML 实体，则需要将它们解释为 HTML 而不是文本。

【讨论】：

我想补充一点，将用户的输入解释为 HTML 会带来安全风险
谢谢！有趣的@German 为什么会带来安全风险？
我认为他引用了 XSS（跨站点脚本）（这里是：computerweekly.com/tip/…）。您只需要注意您放入 v-html 中的数据来自安全的地方和/或已正确清理，因此您不会打开您的网站来执行恶意脚本:)

【解决方案2】：

v-html 指令用于使用我们的数据更新元素的 innerHTML。这就是它与 v-text 的区别，这意味着当 v-text 接受字符串并将其视为字符串时，它将接受字符串并将其呈现为 HTML。

【讨论】：