Cannot read properties of undefined (reading 'isVisible')

[Sean Milburn]

Weirdly I get the error - Cannot read properties of undefined (reading 'isVisible')

when I try to use the component. my code is as follows

  <confetti-explosion
    v-if="parseFloat(totalPrice) >= 40"
    :colors="['#ff1e5f', '#6543fe']"
  />

Might also be worth mentioning that I'm using it as a Nuxt plugin like so...

import Vue from "vue"
import ConfettiExplosion from "vue-confetti-explosion"

Vue.use(ConfettiExplosion)

Any idea why? ChatGPT seems to think this...

Based on the code you provided, the isVisible variable is defined within the setup() function using the ref() function, but it's not exported as a part of the component's public API. Therefore, other parts of the component that are outside the setup() function cannot access isVisible, resulting in the error you're seeing.

To fix this, you can add isVisible to the component's return statement so that it's included in the public API: