Accessing $vuetify instance property from vuex store

问题

I was using vuetify and wanted to change theme from vuex store using $vuetify instance but i got this error Cannot set property 'theme' of undefined"

here is my code

export default {
  getters: {},
  mutations: {
    toggleDarkTheme(state) {
      this.$vuetify.theme.primary = "#424242";
    }
  }
};

回答1:

$vuetify is an instance property hence you can access any vue instance property using

Vue.prototype.$prop

For your case

import Vue from 'vue';
export default {
  getters: {},
  mutations: {
    toggleDarkTheme(state) {
      Vue.prototype.$vuetify.theme.primary = "#424242";
    }
  }
};

回答2:

For Vuetify 2.0 you can try following method. (After following Vuetify 2.0 Upgrade guide for themes)

import vuetify from './plugins/vuetify'

export default {
  getters: {},
  mutations: {
    toggleDarkTheme(state) {
      Vuetify.framework.theme.themes.light.primary = "#424242";
    }
  }

回答3:

For Nuxt.js projects with Vuetify set as a buildModule, you can access $vuetify from the $nuxt property in the Vue instance:

import Vue from 'vue';
export actions = {
  yourAction() {
    Vue.prototype.$nuxt.$vuetify.theme.dark = true;
  }
}

来源：https://stackoverflow.com/questions/51106931/accessing-vuetify-instance-property-from-vuex-store