5

スプレッド演算子を使用したい。シナリオは、プレイヤーがいない場合です (UI にプレイヤー タイルとして表示されます)。いずれかのプレイヤー タイルをクリックすると、アクティブになります (強調表示されます)。条件は、一度に 1 人のプレーヤーだけを強調表示することです。そのため、プレーヤー タイルがその属性をクリックするifActive: trueと、残りのプレーヤーの属性ifActive: falseplayerReducerクリックされたプレーヤー ID として取得されますaction.payload(action.payloadは現在クリックされているプレーヤーの ID を示します)。ここで、変更stateせずに変更する必要があります。そのためにスプレッド演算子を使用する必要があります。スプレッド演算子を使用してインデックスで特定のオブジェクトを変更する方法は?

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

スプレッド演算子を使用してインデックスで特定のオブジェクトを変更する方法は? 厳密にはスプレッド演算子を使用する必要があり、各プレイヤーにはifActive属性が必要です。

4

2 に答える 2

2
return { ...state, players: state.players.map(player => ({ ...player, selected: player.id === action.id })) };
于 2016-09-14T05:36:48.217 に答える