把组件移动到指定容器中去——teleport
除了移到body上还可以移到任意节点上,比如id="app"节点上就
一种使用场景:
里面有两个模块,为了符合逻辑/语义化,这两个模块是应该包含在这一个div中的,其中一个需要相对于当前div做绝对定位,但是另一个要相当于body做绝对定位(矛盾了)
father.vue:
我要在father的正中心
我虽然是father的daughter,但是我要在body的正中心
对于daughter和son的共同需求,又必须都是father的child的条件下,我们需要为daughter重新找一个定位参照
方式一:在daughter.vue内部加teleport
daughter.vue
//这样就把daughter移到了body上去,虽然在vue文件中,daughter写在father内,但渲染时,daughter是body子节点
方式二:在daughter标签上加teleport
father.vue
我要在father的正中心
我对然是father的daughter,但是我要在body的正中心