Redux状态对象的结构

Question

我是redux的新手，在设计redux状态的形状时我很困惑。我当前的redux状态部分看起来像这样

邀请减速器：

invitees: [{
    '_id': '626262',
    'name': 'xyz'
}, {
    '_id': '6262',
    'name': 'jsjsj'
}, {
    '_id': '626',
    'name': 'gdgdg'
}
....
]

我应该像这样保留此对象，还是应该保留ID并将其作为键，例如：

invitees: [626262: {
    'name': 'xyz'
}, 6262: {
    'name': 'jsjsj'
}....]

如果我必须选择第二种方法，该怎么做？ 我读过一些博客，其中说第二种选择会有所帮助。

Answer 1

您可以使用Reduce和Object Spread Operator 将响应数组转换为所需的内容

const data = [
    { id: 1, name: 'name-1' },
    { id: 2, name: 'name-2' },
    { id: 3, name: 'name-3' },
    { id: 4, name: 'name-4' },
    { id: 5, name: 'name-5' }
];

function myReducer({ payload }) {
    return payload.reduce((acc, current) => {
        return Object.assign({}, acc, {
            [current.id]: {
                [current.name]: current.name
            }
        })
    }, {});
}


const newState = myReducer({ payload: data });

console.log(newState);
/**
{
   1: { name: 'name-1' }
   2: { name: 'name-2' }
   3: { name: 'name-3' }
   4: { name: 'name-4' }
   5: { name: 'name-5' }
}
*/

Answer 2

您的第二个示例不是有效的javascript对象。 在第二个示例中，您需要的不是数组，而是像

invitees: {
    '626262': {
       'name': 'xyz'
    }, 
    '6262': {
       'name': 'jsjsj'
    }
    ....
}

从某种意义上说，第二个示例可以帮助您，为了获得名称属性，您不必循环遍历数组的每个元素来搜索id，而可以使用brackets表示法直接进行访问

例

return Object.assign({}, state, {
    [id]: {
        name: 'abc'
    }
})