使用 VueX,我收到此错误:
未捕获类型错误:无法读取未定义的属性(读取“状态”)
我无法弄清楚为什么会出现此错误,我认为这可能是因为较新的版本,但不确定。
代码:
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>
除了 @youdu 提供的插件排序答案之外,我认为您应该更改 main.js 中的 store 导入行以消除解构,因此而不是:
import { store } from "./store.js";
你会:
import store from "./store.js";
store 是 store.js 的唯一导出,因此您不想使用解构语法。