将所有 Vuex 状态对象属性解构/映射到组件范围答案

【问题标题】：Deconstructing/mapping all Vuex state object properties to component scope将所有 Vuex 状态对象属性解构/映射到组件范围
【发布时间】：2020-03-08 09:29:38
【问题描述】：

在我的组件中，我试图从 Vuex 状态中检索对象，并将其所有属性直接绑定到组件的范围（作为 Vuex 绑定）。

new Vuex.Store({ 
    state: {
        data: {
            a: '123',
            b: '456',
            c: '789',

Vuex 提供的 mapState/Getters 选项有没有更简洁的方法来实现这一点？

例如

computed:{
    ...mapState{
        'a': state => state.data.a,

【问题讨论】：

标签： javascript vue.js vuejs2 vuex

【解决方案1】：

mapState 和其他 Vuex 实用程序函数不提供处理嵌套键的特定方法。这可以通过辅助函数来完成：

const mapStateData = (...dataKeys) => mapState(
  Object.fromEntries(dataKeys.map(key => [key, state => state.data[key]]))
);

...

computed: {
  ...mapStateData('a', 'b')
}

【讨论】：