遵循VueMaster课程中的一个简单示例,似乎无法从商店中读取状态。这是我的main.js:
import Vue from 'vue'
import upperFirst from 'lodash/upperFirst'
import camelCase from 'lodash/camelCase'
import App from './App.vue'
import router from './router'
import store from './store'
new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')
这是我在/ store文件夹中的index.js:
import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
state: {
user: { id: 'abc123', name: 'Adam Jahr' },
},
mutations: {},
actions: {},
modules: {}
})
然后,我尝试从组件读取状态对象:
<template>
<div>
<h1>Create an Event, {{ $store.state.user.name }}</h1>
</div>
</template>
我在浏览器中看不到该组件的任何内容。控制台显示错误“ TypeError:无法读取未定义的属性'名称'”。
知道为什么这个非常简单的示例不起作用吗?谢谢。
您的导入不应该像这样:
import store from './store/index'
由于这是您创建商店的地方,因此请检查文件夹结构,也许就是问题所在。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句