Vuejs2 如何强制Vue更新修改后的HTML

我使用一个自定义指令来呈现带有KaTeX函数的LaTeX代码。显然，这会更改组件的

innerHTML

。我想在内容改变后重新运行KaTeX，但是：内容永远不会改变

问题的简单再现不需要KaTeX或指令，并且仍然显示，反应性是有效的，但对于具有更改的

innerHTML

：

{{content}}
{{content}}
从“Vue属性装饰器”导入{Component，Ref，Vue}；
@组件（{}）
导出默认类测试扩展Vue{
content=“你好，世界！”；
@Ref（）
元素！：HTMLSpanElement；
mounted（）：void{
//在没有以下语句的情况下，Vue会在一秒钟后使用新内容正确地重新呈现整个组件
//在这一行中，不会对span元素进行更新。
this.elem.innerHTML=“你好，世界！”；
设置超时（（）=>{
this.content=“问候！”；
}, 1000);
}
}

我想这是故意的行为，但这并不能解决我的问题。是否有某种方法可以强制Vue在重新渲染后立即替换所有组件的DOM？

您可以在span上使用

键

，但如果您不想将其与

内容

绑定，可以改为将其设置为一个数字，并在每次更改时递增。像这样（我这里不使用TS）：

在span上设置一个

键

：

<span :key="content_key">{{ content }}</span>

这样可以避免直接将

键设置为
内容


这对你有用吗？
有用吗？仅当我给
span
一个与其内容匹配的键以强制Vue替换span时。然而，一旦插槽和类似的嵌套组件概念开始发挥作用（在我的项目中就是这样），这就变得不切实际了：用katex指令将完整的子内容作为最顶层元素的键传递似乎不是一个好主意。那么
forceUpdate（）
解决方案呢？（在同一链接中）…我也不认为您可以使用
v-html
，是吗？这可能会保持reactivity不会做任何新的事情-这是合乎逻辑的，因为已经进行了重新渲染（范围外的内容会更新，但组件内的整个DOM不会更新）。不漂亮，但我想vue真的不允许做更好的事情。谢谢你的主意！
watch: {
    content() {
        this.content_key ++;
    }
}