[Vuejs]-Why Popper throws error Popper: Invalid reference or popper argument provided" in vuejs

by

0👍

✅

Because the tooltip element is not rendered and so you are referencing to nothing.

Your tooltip element looks like:

    <div ref="tooltip" role="tooltip" v-if="isOpen">
      <div :class="[ci-popover, `ci-popover--background-color-${variant}`,`ci-divider--padding-${padding}`]">
        <slot name="default" />
        {{placement}}
      </div>
    </div>

It depends on the state isOpen if it should be rendered and you start with false as value as seen in:

isOpen = false

On mounted, you createPopper right away but you did not open the tooltip yet.

Leave a comment