如何使用react-redux中的spread运算符修改索引处的特定对象?

Raj*_* Rj 5 javascript reactjs spread-syntax redux react-redux

我想使用spread运算符.场景是没有玩家(在UI上显示为玩家牌).每当我点击任何播放器磁贴时,它就会变为活动状态(突出显示).条件是一次只能突出显示一个玩家.所以,当一个球员瓦片被点击它的属性ifActive: true,和其他玩家属性ifActive: falseplayerReducer越来越点击玩家ID为action.payload(action.payload所赐这是目前点击播放器的ID).现在我必须修改我state而不改变它.我必须使用spread运算符.如何使用spread运算符修改索引处的特定对象?

const initialPlayerState = {
  tabs: [
    { id: 1, name: 'player 1', ifActive: false },
    { id: 2, name: 'player 2', ifActive: false },
    { id: 3, name: 'player 3', ifActive: false },
  ]
} 
const playerReducer = (state = initialPlayerState , action) => {
    switch (action.type) {
        case SELECT_PLAYER:
          //how to modify state using spread operator, and how to modify 
          //a specific object at a specific index.  
          return { ...state, /*some code hrere*/};
        default:
          return state;
    }
}
Run Code Online (Sandbox Code Playgroud)

如何使用spread运算符修改索引处的特定对象?严格来说,我必须使用spread运算符,每个玩家都应该有ifActive属性.

Raj*_* Rj 2

return { ...state, players: state.players.map(player => ({ ...player, selected: player.id === action.id })) };
Run Code Online (Sandbox Code Playgroud)