I would like to change the prop of vuetify from the vuex store.
From a component I can do this.$vuetify.theme.dark = true;.
This is not possible in the store but unfortunately I get the same error when trying it like Vue.prototype.$vuetify.theme.dark = true;.
The error I get is Error in v-on handler: "TypeError: Cannot read property 'theme' of undefined".
In my main.js I have the following:
Vue.use(Vuetify);
const vuetify = new Vuetify({
theme: {
dark: true,
themes: {
light: {
primary: colors.purple,
secondary: colors.grey.darken1,
accent: colors.shades.black,
error: colors.red.accent3,
background: colors.indigo.lighten5, // Added variable
},
dark: {
primary: colors.blue.lighten3,
// If using base color, be use to mark as such to get HEX value
background: colors.indigo.base,
},
},
},
});
new Vue({
router,
store,
vuetify,
render: (h) => h(App),
}).$mount('#app');
I find it strange that $vuetify is undefined as I tried something similar with Vue.prototype.$socket.emit('my_event', { data: 'I\'m connected!' }); and this worked.
What could be the error here?