Vuex - 模块状态返回未定义答案

【问题标题】：Vuex - Module state returns undefinedVuex - 模块状态返回未定义
【发布时间】：2021-02-01 18:30:35
【问题描述】：

对于为什么 state 属性会返回 undefined 有点困惑。我是 vue.js 的新手，真的需要了解它是如何工作的。

这是我所做的

在 state.js 文件中让我们说 todo 模块，我有

const state = () => {
    return {
        todos: [
            {
                id: 1,
                title: 'Go outside'
            },
            {
                id: 2,
                title: 'Come back in'
            }
        ]
    }
}
export default {
    state
}

我有一个索引文件，我将所有内容连接在一起并导出

import state from './state'
import getters from './getters'
import actions from './actions'
import mutations from './mutations'

export default {
    state,
    getters,
    actions,
    mutations
}

在我的商店入口点

import Todos from './modules/todos'
export default 
  modules: {
    Todos
  }
})

所以，问题是，动作可以完美运行，但由于状态属性未定义，状态正在影响其他类似 getter 和突变。

vue-devtool 在我的浏览器中停止工作，所以我尝试console.log(this.$store.state.todos)，但是是的，它未定义

【问题讨论】：

你可以试试this.$store.state.Todos ??
返回了一个对象，但我希望不仅可以在计算中访问 todos 属性，还可以在 getter 和 mutation 中访问该属性
你能不能尝试做@Mahamudul提到的事情，并让你的出口声明为export default state
至于 getter 和 mutation，您可以假设您将获得 state 作为参数，因为当您最后将它们合并为一个模块时，Vue 将使其可用于 getter 和 mutation。请分享您的吸气剂和突变文件以获取更多信息
我已经做到了，只是无法弄清楚如何在实际组件中使用它们之前仔细检查所有“getter”

标签： vue.js vuex vuex-modules

【解决方案1】：

您必须修改 state.js 文件。你应该像下面这样导出

export default {
    state: {
        todos: [
            {
                id: 1,
                title: 'Go outside'
            },
            {
                id: 2,
                title: 'Come back in'
            }
        ]
    }
}

【讨论】：

我认为状态应该是一个函数而不是一个对象。我同意你最初的评论，应该是 export default state 而不是 export default {state}
state 不应该是一个函数。如果你使用函数，那么它应该返回带有状态名称的状态对象。但这个解决方案会很好
如何在我的组件中使用 ...mapGetters(['myTodos']) 之前仔细检查它
你的状态值好吗？并分享您的 getters.js 文件
这就是我想要弄清楚的。