Магазин Vuex запущен в mainjs, но не определен в App.vue

Question

main.js:

import Vue from "vue";
import Axios from "axios";
import App from "./App.vue";
import router from "./router";
import store from "./store";

const axios = Axios.create({
  baseURL: process.env.VUE_APP_BASE_URL
})

Vue.prototype.$http = axios;

new Vue({
  router,
  store,
  render: h => h(App)
}).$mount("#app");

когда я пытаюсь использовать $ store в App.vue, оно не определено:

  created() {
    this.$store.dispatch('logout') // this.$store is undefined
  }

store.js:

export default new Vuex.Store({
  actions: {
    logout({commit}) {
      return new Promise((resolve, reject) => {
        commit('logout')
        localStorage.removeItem('token')
        delete Vue.prototype.$http.defaults.headers.common['Authorization']
        resolve()
      })
    }
  }
}

Это потому, что он не инициирован в App.vue, , потому что я могу использовать другие компоненты vue .

Answer 1

import Vuex from 'vuex';

Vue.use(Vuex);

const store = new Vuex.Store({
    // Options
});

И просто поместите в экземпляр Vue.

Надеюсь, это поможет вам.

Answer 2

Вы не импортировали Vuex в Main.JS:

import Vuex from 'vuex'
Vue.use(Vuex)

Подробнее об установке Vuex здесь РЕДАКТИРОВАТЬ: Legit, что все просто украли мой ответ ...

Answer 3

Сначала вам нужно установить Vuex, используя npm install vuex --save

Затем импортируйте его в store.js.

Чтобы понять, КОГДА , ПОЧЕМУ и КАК использовать Vuex, обратитесь по этому URL https://dev.to/napoleon039/when-why-and-how-to-use-vuex-9fl