使用 Vuejs 和 v-html 禁用 eslint 错误

Question

我将 Nuxt 2 与 Vue 2 和 vuetify 一起使用。

我的 vscode 已更新，但 v-html 出现 eslint 错误。

代码是：

 <v-list-item-title
   v-html="`${parent.genFilteredText(item.nome)}`"
   >
 </v-list-item-title>  

错误是：

    [vue/no-v-text-v-html-on-component]

Using v-html on component may break component's content.

在出现这个问题之前，我 <!--eslint-disable vue/no-v-html--> 在我的代码之上使用，没有任何问题

但现在这还不够。

我努力了

<!--eslint-disable vue/no-v-text-v-html-on-component--> 

但没有看

Answer 1

一个简单的方法是，在组件内使用 v-html！

 <v-list-item-title v-html="`${parent.genFilteredText(item.nome)}`>

 </v-list-item-title>

更改为以下模式之一。

<v-list-item-title>
    <span v-html="`${parent.genFilteredText(item.nome)}`"></span>
</v-list-item-title>

// OR
<v-list-item-title>
    <div v-html="`${parent.genFilteredText(item.nome)}`"></div>
</v-list-item-title>

// OR
<v-list-item-title>
    <p v-html="`${parent.genFilteredText(item.nome)}`"></p>
</v-list-item-title>