我正在try 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 /用户/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,这意味着当您导入这些文件时,您将命名要导出的整个对象stategetters等.

所以,在index的范围内,state变量有一个名为state的属性,getters变量有一个名为getters的属性,等等,这是在抛开一些东西.

您应该为这些文件中的每一个导出一个const:

export const state = {
  user: null,
}

然后在导入时抓取命名的const,如下所示:

import { state } from './state'

或者,您可以从每个文件中删除stategetters等的属性:

// state.js
export default {
  user: null,
}

然后像现在这样导入:

import state from './state' 

Vue.js相关问答推荐

Visual Studio代码中的VUE/VLAR扩展不断崩溃:JS/TS语言服务立即崩溃5次…

如何将$validator实例注入到使用组合API语法的Vue2.7应用程序中

如何解决 importers[path] is not a function for clean Vue 3/Vite/Storybook installation

为什么普通对象在 Vue3 中自动变成响应式的?

vue3 ssr 不返回纯 html

如何使用 async/await 在 vue js 中添加标头

无需直接 DOM 操作即可绘制d3-axis

用 axios 搜索:新字符时取消之前的请求

使用 vee-validate 在 vue js 中进行验证有错误

如何在 Vue.js 3 中使用 Vue 3 Meta?

在 v-for 循环中使用 v-model

如何从 vue.js 捕获 Jquery 事件

在找不到图像源时设置替代图像

来自 Vue.js 的 ESLint 插件的消息中的LHS是什么意思?

VueJS 2 在多个组件上debounce

vuex 是 state.array.push react式的吗?

Vue.js 3 - 替换/更新react性对象而不会失go react性

在 Vuejs 中放置 firebase.auth().onAuthStateChanged() 的位置

Vuetify 过渡:如何设置过渡速度

vue-router 如何使用 hash 推送({name:"question"})?