如何使用操作調度向數組中的每個對象添加鍵屬性？

Question

所以，這是問題所在。 我的減速機中有一個狀態。

const initialState = {
        arrOfObjects: [
           {name: 'William', age: 30, nickname: 'Will'},
           {name: 'Joseph', age: 31, nickname: 'Joe'},
           {name: 'Jeffery', age: 32, nickname: 'Jeff'}
       ]
    }

然后我發出一個動作

axios.all(personIds.map(el => axios.get(`/people/${el}/persons`)))
.then(res => {
  for (let per in res) {
    dispatch(personLastname(res[per].data.lastname))
     }
 });

在此之后我在減速機中做下一步

case actionTypes.PERSON_LASTNAME:
            return{
                ...state,
                arrOfObjects: state.arrOfObjects.map(person => ({
                    ...person,
                    _lastname: action.lastname
                }))
            }  

所以問題在於，通過這種方法，我將key屬性添加到數組中的每個對象，但每個對象都具有相同的鍵值，即調度的最后一個值。

const initialState = {
    arrOfObjects: [
       {name: 'William', age: 30, nickname: 'Will', _lastname: 'Smith'},
       {name: 'Joseph', age: 31, nickname: 'Joe', _lastname: 'Smith'},
       {name: 'Jeffery', age: 32, nickname: 'Jeff', _lastname: 'Smith'}
   ]
}

如何將屬性_lastname添加到每個對象，但是按照我在調度操作時獲得的順序，第一個姓氏應該轉到John對象，第二個轉到Jack等等......

Answer 1

我前段時間已經看過這樣的問題了。 他們正在使用數組作為有效負載而不是單個項來發送動作。 這假設resp中的姓氏對象的順序與狀態相同。

axios.all(personIds.map(el => axios.get(`/people/${el}/persons`)))
  .then(res => dispatch(personLastname(res));

export const personLastname = people => {
    return{
        type: PERSON_LASTNAME,
        people: people
    }
}    


case actionTypes.PERSON_LASTNAME:
  return {
    ...state,
    arrOfObjects: state.arrOfObjects.map((person, i) => ({
      ...person,
      _lastname: action.people[i].data.lastname
    }))
  }

好像它會工作正常。