vue.js - 使用 v-popover 组件定位非包装元素

Question

v-popover 组件在将元素包装在其中时效果很好，例如：

<v-popover offset="0" placement="right">
  <span>My awesome span</span>
  <template slot="popover">My awesome popover</template>
</v-popover>

但是我想为 v-popover 组件指定目标元素而不包装元素。这个弹出框是在一个组件中生成的，该组件在页面上被多次实例化，每个都有自己唯一的 ID 和弹出框。

在阅读了popover 组件参考和这个 GitHub 讨论之后，“容器”或“目标”选项听起来像是解决方案。我努力了：

<v-popover offset="0" placement="right" :container="'#' + this.id">
  <template slot="popover">My awesome popover</template>
</v-popover>

和

<v-popover offset="0" placement="right" :target="this.id">
  <template slot="popover">My awesome popover</template>
</v-popover>

但弹出窗口没有出现。我已经在 html 中确认组件 ID 正在正确生成并填充到弹出框的属性中。什么不见​​了？

Answer 1

v-popover 组件不支持定位非包装元素。