Vue 自动转义 html 字符

Question

这是我的计算方法之一：

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

这应该突出显示搜索框中的文本，但<转义为<. 我应该怎么做才能抑制逃逸，或者我怎样才能做得更好？

Answer 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/