vue-html 不打印 html 实体格式

Question

我正在使用 htmlentities

保存以下信息

<i class='fa fa-user'></i>

在我的数据库中信息保存如下

&lt;i class='fa fa-user'&gt;&lt;/i&gt;

我在使用 vue js 的前端收到此信息。我正在使用 v-html 指令进行打印。

And what I wanted is o print in html, like for example, when i save without htmlentities

Does anyone know how I could do this on the frontend with vue?

Answer 1

您必须先对字符串进行转义。像这样：

methods: {
  unescape(string) {

    //create an element with that html
    var e = document.createElement("textarea");
   
    //get the html from the created element
    e.innerHTML = string;

    return e.childNodes.length === 0 ? "" : e.childNodes[0].nodeValue;
}

并在您的模板中引用它：

<i v-html="unescape(here_your_html)"></span>

vue-html 不打印 html 实体格式

vue-html don't print with html entities format

html-entities

vue.js