Vue－窩想放到其他位置可以嗎？（Teleport）

雖然還沒實際用過，但還是能了解一下。

這個跟 React－用 portal 把元件移到我想要的位置 在做的事情是一樣的，就是自己決定「元件的渲染位置」：

<template>
  <div class="container">
    <div class="block">
      <button class="btn" @click="onOpenUser">Show user</button>
    </div>
  </div>
  <!-- 插到 body 中 -->
  <teleport to="body">
    <Modal v-if="isUserModal" @onClose="onUserClose">
      <h1>PeaNu</h1>
      <p>peanu@peanu.dev</p>
      <template v-slot:actions>
        <button class="btn">Add Friend</button>
        <button class="btn">Block User</button>
      </template>
    </Modal>
  </teleport>
</template>

<teleport to="..."> 的內容是「CSS selector」，所以你也可以填入 #body 或 .body 之類的東西，總之只要是合法的就好了。