I'm running into a console error message every time I try to click the button for $model.show('demo-login'):
TypeError: Cannot read property 'show' of undefined
Error output when the button is clicked:
TypeError: Cannot read property 'show' of undefined
at click (product.vue?1da5:1)
at ie (vue.runtime.esm.js:1854)
at HTMLButtonElement.i (vue.runtime.esm.js:2179)
at HTMLButtonElement.Jr.a._wrapper (vue.runtime.esm.js:6917)
re @ vue.runtime.esm.js:1888
ne @ vue.runtime.esm.js:1879
ee @ vue.runtime.esm.js:1839
ie @ vue.runtime.esm.js:1862
i @ vue.runtime.esm.js:2179
Jr.a._wrapper @ vue.runtime.esm.js:6917
My code snippet:
product.vue
<template>
<div class="app">
<demo-login-modal/>
<button @click="$model.show('demo-login')">PP</button>
</div>
</template>
<script>
import DemoLoginModal from '@/components/Modal_Login.vue';
export default {
name: 'product',
components: {
DemoLoginModal,
},
};
</script>
Main.js
import Vue from 'vue';
import Product from '@/components/product.vue';
import VModal from 'vue-js-modal';
Vue.use(VModal);
Vue.config.productionTip = false;
new Vue({
render: (h) => h(Product),
}).$mount('#app');
The PopUp in a copy of Model_login
Original GitHub issue here: https://github.com/euvl/vue-js-modal/issues/609