Javascript 将html元素字符串传递给vue自定义指令，使用eslint发出

我创建了两个自定义vue指令以在另一个元素之后或之前插入html元素，我将html元素字符串传递给应用该指令的元素，但VS代码显示以下错误：

Parsing error: unexpected-character-in-attribute-name.eslint-plugin-vue

我就是这样做的：

<rad-stack title="Precio final" v-insert-before="'<div class="RADcard3_texts_info_divider"></div>'">{{ item.finalPrice }} €</rad-stack>

---

问题在于双引号

“”

。由于html属性值用双引号包装，因此不能在字符串中使用它们

您可以将该值指定给实例变量，并在模板中引用它，如下所示：

Vue模板

<rad-stack title="Precio final" v-insert-before="prefixMsg">{{ item.finalPrice }} €</rad-stack>

{{item.finalPrice}}

Vue脚本

data() {
 return {
   prefixMsg: '<div class="RADcard3_texts_info_divider"></div>'
 }
}

data（）{
返回{
前缀xmsg:'
}
}

我得到了这个错误：Node.insertBefore的参数1不是一个对象。@gabogabans

Node.insertBefore

方法需要一个dom对象而不是html字符串。参考资料。

data() {
 return {
   prefixMsg: '<div class="RADcard3_texts_info_divider"></div>'
 }
}