Vue中如何展示从Fetch请求获取的HTML代码？

你用{{variable.information}}无法正确渲染HTML，是因为Vue的双大括号语法会把所有内容解析为纯文本，不会识别并渲染HTML标签。要解决这个问题，需要使用Vue的v-html指令：

解决方法 #

直接在模板中用v-html指令绑定你的变量，它会把变量中的HTML内容解析并渲染成对应的DOM结构：

<template>
  <div v-html="variable.information"></div>
</template>

注意事项 #

• v-html会直接渲染传入的HTML内容，所以必须确保API返回的内容是可信的（比如来自你自己的后端，没有用户提交的恶意代码），否则可能会引发XSS安全风险。
• 不要在单个元素上同时使用v-html和双大括号语法，v-html会覆盖元素内的所有内容。

内容的提问来源于stack exchange，提问作者hardgrind