vue3子组件向两个父组件传递不同的div

在Vue3中，可以使用`<teleport>`组件来实现将子组件渲染到不同的DOM节点上。

你可以在子组件中使用`<teleport>`来分别渲染到两个不同的DOM节点上，如下所示：

<template>
  <div>
    <teleport to="parent1">
      <div>我是渲染到parent1的div</div>
    </teleport>
    <teleport to="parent2">
      <div>我是渲染到parent2的div</div>
    </teleport>
  </div>
</template>

然后在父组件中，你需要在对应的位置添加一个具有相应id的DOM节点，这个节点将会作为`<teleport>`的目标DOM节点。

<template>
  <div>
    <div id="parent1"></div>
    <child-component></child-component>
    <div id="parent2"></div>
    <child-component></child-component>
  </div>
</template>

当子组件被渲染时，它会自动将`<teleport>`标签中的内容渲染到与`to`属性匹配的DOM节点上。这样，你就可以在两个不同的父组件中分别渲染子组件中的不同`<div>`了。