Target non-wrapped element with v-popover component

Question

The v-popover component works great when wrapping an element inside of it, eg:

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

However I'd like to specify the target element for the v-popover component without wrapping an element. This popover is being generated in a component that gets instantiated multiple times on the page, each with its own unique ID and popover.

After reading the popover component reference and this GitHub discussion the "container" or "target" options sound like the solution. I have tried:

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

and

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

but the popover does not appear. I have confirmed in the html that the component ID is being generated correctly and populated in the popover's attributes. What is missing?

Answer 1

The v-popover component does not support targeting a non-wrapped element.