html - 渲染期间不翻译 HTML 字符

Question

我有一些呈现以下 HTML 的 js 代码

<div contenteditable="false" tabindex="0" class="ProseMirror">
    <p> didn&#039;t project a significant increase</p>
</div>

在浏览器中，它实际上显示字符#039;而不是将其转换'为有没有办法强制/阻止浏览器进行这种转换？

Answer 1

渲染HTML 实体时，可能需要对其进行编译。您可以使用以下选项之一：

• 插值

<p> didn{{ `&#039;` }}t project a significant increase</p>

• v-html

<p> didn<span v-html="`&#039;`"></span>t project a significant increase</p>

请注意，前两个示例使用的是模板文字，而不是单引号。

• 渲染功能

如果使用渲染功能，您可以设置innerHTML domProps：

render(h) {
  return h('span', {
    domProps: {
      innerHTML: 'didn't project a significant increase'
    }
  });
}

这是一个演示

---

原来的

你错过了一个&，它应该是：

<p> didn&#039;t project a significant increase</p>

Answer 2

在我的具体情况下。我结束了。通过使用heHTML 编码器/解码器https://www.npmjs.com/package/he在渲染之前解码 HTML 来解决问题。