I'm getting the error below from the console when I pressed on the button while it's showing Close:
"Error: Cannot find module './undefined'"
found in
---> <WhatsNew> at src/components/WhatsNew.vue
Below is the WhatsNew.vue
<template>
<u-modal v-model="modalActive">
......
......
<div class="whats-new-options">
<div id="whats-new-checkbox">
<u-checkbox v-model="whatsNewStatusInactive" label="Don't show again"/>
</div>
<div id="whats-new-next-button">
<u-button id="whats-new-close-btns" full color="secondary" @click="nextNew">{{notViewedAll ? 'Next' : 'Close' }}</u-button>
</div>
</div>
</div>
</u-modal>
</template>
<script>
import { mapGetters, mapMutations } from "vuex";
export default {
data() {
return {
modalActive: false,
notViewedAll: true,
newFeaturesOnUsedCount: 3,
current: 0,
}
},
methods: {
...mapMutations("client", ["updateWhatsNewStatus"]),
nextNew() {
if (this.current <= this.newFeaturesOnUsedCount -1 ){
this.current += 1
}
if (this.current >= this.newFeaturesOnUsedCount && !this.notViewedAll) {
this.modalActive = false
}
if (this.current >= this.newFeaturesOnUsedCount - 1) {
this.notViewedAll = false
}
}
}
I'm not sure what's causing the error, I've fixed it with a band aid solution by changing:
<u-modal v-model="modalActive">
to
<u-modal v-model="modalActive" v-if="modalActive">
However this doesn't feel right, I shouldn't need to use v-if to control the modal, the v-modal itself should be sufficient? But why is it that I get the error mentioned above? Thank you
Try using v-show instead and you need not to use v-model.
<u-modal v-show="modalActive">