我正在试验 vuex,我一直在寻找组织我的 vuex 文件的最佳方式,我完成了这样的事情:
/src/store/user/state.js:
export default {
state: {
user: null
}
}
/src/store/user/getters.js:
export default {
getters: {
user (state) {
return state.user
}
}
}
/src/store/user/mutations.js:
export default {
mutations: {
'SET_USER' (state, user) {
state.user = user
}
}
}
/src/store/user/actions.js
export default {
actions: {
loginUser ({ commit }, params) {
commit('SET_USER', {id: 1})
}
}
}
/src/store/user/index.js
import state from './state'
import getters from './getters'
import actions from './actions'
import mutations from './mutations'
export default {
state,
getters,
actions,
mutations
}
/src/store/index.js:
import Vue from 'vue'
import Vuex from 'vuex'
import user from './user'
Vue.use(Vuex)
export default new Vuex.Store({
modules: {
user
}
})
当我加载我的代码时,它在控制台中返回以下错误:
vuex: unknown getter: user
最佳答案
您的每个与用户相关的文件都使用export default
,这意味着当您导入这些文件时,您正在命名要导出的整个对象state
, setter/getter
等
因此,在 index
范围内,state
变量有一个名为 state
的属性,getters
变量有一个名为 getters
的属性,等等。这是把事情搞砸了。
您应该为这些文件中的每一个导出一个 const
:
export const state = {
user: null,
}
然后在导入时像这样获取命名的 const
:
import { state } from './state'
或者,您可以只从每个文件中删除 state
、getters
等属性:
// state.js
export default {
user: null,
}
然后像您已经在做的那样导入:
import state from './state'
关于javascript - vuex:未知 setter/getter :用户,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44046642/