Sometimes, we want to fix ‘this.$store is undefined’ with Vue.js and Vuex.
In this article, we’ll look at how to fix ‘this.$store is undefined’ with Vue.js and Vuex.
How to fix ‘this.$store is undefined’ with Vue.js and Vuex?
To fix ‘this.$store is undefined’ with Vue.js and Vuex, we should put the Vuex store instance into the object we use to create the Vue
instance.
For instance, we write
import Vue from "vue";
import App from "./App.vue";
import router from "./router";
import Vuex from "vuex";
import store from "./store";
Vue.config.productionTip = false;
Vue.use(Vuex);
new Vue({
router,
store,
render: (h) => h(App),
}).$mount("#app");
to import the Vuex store
and put it into the object we create the Vue
instance with to make this.$store
available in all components in the app.
Conclusion
To fix ‘this.$store is undefined’ with Vue.js and Vuex, we should put the Vuex store instance into the object we use to create the Vue
instance.