使用 Vuex 时出现错误 Uncaught TypeError: Cannot read properties of undefined (reading 'state') in vuejs

Question

`我正在尝试学习 vuex 并遵循 youtube 上的 vuex 教程，我遇到了 TypeError: Cannot read properties of undefined (reading 'state') 错误，我无法弄清楚为什么会出现此错误，我认为这可能是因为新版本不确定。这是我的代码。

`

main.js

import { createApp } from "vue";
import { store } from "./store.js";
import App from "./App.vue";

const app = createApp(App);
app.mount("#app");
app.use(store);

import { createStore } from "vuex";

// Create new store instance

export const store = createStore({
  state() {
    return {
      toggle: false,
      count: 0,
    };
  },
});

<template>
  <main class="paddings innerWidth n-container flexCenter">
    <div class="nav-options flexCenter innerWidth">
      <h1>VUE-FLIX</h1>
      <h2>{{ count }}</h2>
    </div>
  </main>
</template>

<script>
import "../NavBar/NavBar.css";
// import { mapState } from 'vuex'

export default {
  name: "NavBar",

  data() {
    return {
      name: "Vinoth",
    };
  },

  computed: {
    count() {
      return this.$store.state.count;
    },

    // ...mapState({
    //   count: (state) => state.count,
    // }),
  },
};
</script>

请任何人帮助我。给我一个解决方案

Answer 1

除了 @youdu 提供的插件排序答案之外，我认为您应该更改 main.js 中的 store 导入行以消除解构，因此而不是：

import { store } from "./store.js";

你会：

import store from "./store.js";

store 是 store.js 的唯一导出，因此您不想使用解构语法。