Vue 自动转义 html 字符答案

【问题标题】：Vue is automatically escaping html charactersVue 自动转义 html 字符
【发布时间】：2019-03-08 22:33:30
【问题描述】：

这是我的一种计算方法：

            filtered() {
                return this.groups.map(group => {
                    return group.replace(this.search, '<span class="has-background-primary">' + this.search + '</span>');
                })
            }

这应该突出显示搜索框中的文本，但 &lt; 被转义为 &lt;。我应该怎么做才能抑制转义或如何做得更好？

【问题讨论】：

你想做什么，因为从这里看起来你可以用 v-if 做到这一点
我正在尝试突出显示搜索到的文本。如果我在列表中有“mozambik”，在搜索框中有“zam”，我想要 moZAMbik，其中大写字母突出显示，所以它应该看起来像：Mozam自行车
可能与此类似。 stackoverflow.com/questions/30877491/vue-display-unescaped-html

标签： javascript html vue.js filtering html-escape-characters

【解决方案1】：

你在正确的轨道上。唯一缺少的是在您呈现结果/列表的地方的v-html。

<div v-for="item in items" v-html="item">
  <!-- if the item now contains raw html it will not be escaped -->
</div>

我为演示创建了一个小小提琴：http://jsfiddle.net/6bto2nkv/

【讨论】：

就是这样，我尝试使用三重大括号，但我猜这是旧语法
是的，在 vue 2.0 中，三重胡须已被弃用