ページネーション・レデューサーにデータを追加する - reactjs

Question

値が配列であっても、私のレデューサーが自分のネストされたデータをオーバーライドし続けるのはなぜですか？基本的に私がここにビルドしているのは、ページネーションのようなものです。これまでのところ、ここに私のコードがあります：

const INITIAL_STATE = { 
    data: [], 
    page: 1 
}; 

export default (state = INITIAL_STATE, action) => { 
    switch(action.type) { 
     case GET_NEWS_SUCCESS: { 
      return { 
       data : { 
        [action.payload.category]: [ action.payload.data ] 
       }, 
       page: action.payload.page }; 
     } 
    } 

    return state; 
} 

下の画像は、基本的には、次の状態のためechelon arrayに0キーがまだ存在すべきであり、データの別のセットを追加します、私の減速の戻りデータです。しかし、2番目の赤い矩形で見ることができるように、前の0のキーを上書きします。

Answer 1

あなたは、これらの行で、既存の配列を上書き：既存のアレイに新しいオブジェクトを追加する必要があり

data : { 
    [action.payload.category]: [ action.payload.data ] 
}, 

。

case GET_NEWS_SUCCESS: { 
      if (!state.data[action.payload.category]) { 
       state.data[action.payload.category] = []; 
      } 
      return { 
       data : { 
        [action.payload.category]: [ ...state.data[action.payload.category], action.payload.data ] 
       }, 
       page: action.payload.page }; 
     }