如何为大对象中的每个嵌套对象创建对象并将其添加到 Redux 状态？答案

【问题标题】：How to create object for each nested object in large object and add it to Redux state?如何为大对象中的每个嵌套对象创建对象并将其添加到 Redux 状态？
【发布时间】：2019-12-26 06:04:13
【问题描述】：

我有以下操作：

export const contextualize = (data) => {
    return {
        type: 'CONTEXTUALIZE',
        payload: data,
    }
}

这是我目前的减速机：

const contextReducer = (state=null, action) => { // NEED TO UNPACK PAYLOAD
    switch(action.type){
        case 'CONTEXTUALIZE':
            state =  action.payload
            return state
        default:
            return state
    }
}

export default contextReducer

我的 Payload 看起来像这样。它是一个 4 级嵌套对象：

{
    {
    contextA: {
        A: 'Bar',
        }
        {
        B: 'Boo'
        }
    }

    {
    contextB: {
        C: 'Bee',
        }
        {
        D: 'Bad'
        }
    }

    {
    contextC: {
        E: 'Bay',
        }
        {
        F: 'Bat'
        }
    }

}

我认为我需要使用嵌套的 for 循环来执行此操作，但 我不确定如何从每个最里面的对象中创建一个具有相应值的新对象并将该对象添加到我的状态中。

以上面的payload为例，我想实现这个：

state = {'A': 'Bar'}, {'B': 'Boo'}, {'C': 'Bee'} 等

关键是我希望能够从我的 Redux 全局状态单独访问每个最内部的对象，而不必使用这样的语法，因为它是多余的，而且我的实际键名要长得多：

BigObject.contextA.B

【问题讨论】：

标签： json reactjs object redux

【解决方案1】：

您可以解构有效负载，然后将生成的对象传播到您的状态中。

您提供的示例状态不是有效的 javascript 对象，但假设您的有效负载类似于：

const examplePayload {
  contextA: {
    A: 'Bar',
    B: 'Boo'
  },
  contextB: {
    C: 'Bee',
    D: 'Bad',
  },
  contextC: {
    E: 'Bay',
    F: 'Bat'
  }
}

const contextReducer = (state=null, action) => { // NEED TO UNPACK PAYLOAD
    switch(action.type){
        case 'CONTEXTUALIZE': {
            const {contextA, contextB, contextC} = action.payload;
            return {...contextA, ...contextB, ...contextC};
        }
        default:
            return state
    }
}

export default contextReducer

【讨论】：