如何使用操作调度向数组中的每个对象添加键属性？

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
    }))
  }

好像它会工作正常。