使用 Tether 在 Vue 2.2.1 中操作 DOM 会导致错误。有正确的方法吗?

Manipulating DOM in Vue 2.2.1 using Tether is causing errors. Is there a right way to do it?

我正在尝试使用 tether and vue 2.2.1 together. Here is a jsfiddle example: https://jsfiddle.net/awei01/fwttsa6o/2/

(我认为)tether 的作用:

我试图通过摆弄 Popup 组件的 beforeDestroydestroyed 生命周期挂钩来解决这个问题,但它似乎没有帮助。

我在 react 中解决了这个问题,方法是简单地将拴系的 DOM 元素移回其在 componentWillUnmount 生命周期挂钩上的原始位置。

我想知道在 vue 中解决此问题的最佳方法是什么。我的另一个想法是先发制人地将一个新的 DOM 节点插入到 body 并强制 Popup 组件使用该节点进行渲染,但我不知道该怎么做。

如有任何建议,我们将不胜感激。谢谢

v-if 更改为 v-show 似乎可以解决问题。

<popup v-show="popup1" target="anchor1">
    Some popup content
</popup>