Question

我使用Vuex创建了一个新的vue-cli webpack项目。我在store.js中初始化了我的Vuex商店，如下所示：

import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);

const store = new Vuex.Store({
  state: {}
});

export default store;

在我的App.vue中，我从'./store.js'导入商店，工作正常，但this.$store未定义。我错过了什么？

这是我的App.vue

<script>
import Navigation from "@/components/Navigation";
import axios from "axios";
import store from "./store";
export default {
  created() {
    console.log("store from $store", this.$store);
    console.log("store from store: ", store);
  }
}
</script>

第二个console.log(store)工作正常。

Answer 1

我找到了解决方案。在我的main.js中，我没有在Vue实例上设置商店。对于任何一个陷入困境的人来说，这就是你需要的： main.js

import Vue from "vue";
import App from "./App";
import router from "./router";
import store from "./store"; // this
require("./assets/styles/main.scss");

Vue.config.productionTip = false;

new Vue({
  el: "#app",
  router,
  store, // and this
  components: { App },
  template: "<App/>"
});

Vuex存储此。$ store未在Vue.js组件

1 个答案: