Question

列表项

我有一个具有这种结构的redux商店

const INITIAL_STATE = {
    currentData: [
        {
            title: 'Total Insurance Bought',
            img: 'insurance-bought.svg',
            bg: 'insurance-shield',
            data: '',
        },
        {
            title: 'Total Amount of Claims',
            img: 'amount of claims icon.svg',
            bg: 'amount-of-claims',
            data: '',
        }
    ]
}

这是我的reducer函数的当前结构

const summaryReducer = (state = INITIAL_STATE, action ) => {
    switch(action.type){
        case 'SET_SUMMARY_DATA':
            return {
                ...state,
                currentData: {
                    ...state.currentData,
                    data: action.payload
                }
            }
        default: 
            return state
    }
}

我想在action.payload中将此数组的值分布到初始状态的每个数据属性中，同时返回整个状态。

[ 0 , 20000 ]

我希望输出为

const INITIAL_STATE = {
    currentData: [
        {
            title: 'Total Insurance Bought',
            img: 'insurance-bought.svg',
            bg: 'insurance-shield',
            data: '0',
        },
        {
            title: 'Total Amount of Claims',
            img: 'amount of claims icon.svg',
            bg: 'amount-of-claims',
            data: '20000',
        }
    ]
}

Answer 1

如果您当前的数据将始终具有两个数组项，并且预期的有效负载将具有按预期顺序的两个元素，则可以采用这种方式。

case 'SET_SUMMARY_DATA':
  return {
     ...state,
     currentData: currentData.map((currentItem, index) => {
       currentItem.data = action.payload[index];
       return currentItem;
     })
  }

如何跨不同数组对象的属性传递数组的值

1 个答案: