定義Reducers時主要規則之一是reducer不能改變原始狀態值，為了不改變原始狀態值並更新新的狀態值，使用 JavaScript 的擴展運算符(…state)返回陣列的新副本而不是改變原始陣列的方法，複製現有狀態值只更新必要的屬性。但在實際應用中，嵌套狀態(nested levles state)會變得複雜難以處理。

 const { id,data} = action.payload;
     return{
          ...state, list:[
              ...state.list,
                  {
                     id:id,
                     data:data
                  }
               ]
            }
            

default:return state;        
    }  

我們可以使用 Immer，它提供了一個名為produce的函數，接受兩個參數：原始state和回調函數。回調函數被賦予該狀態的“草稿”副本，在回調函數中將action.payload指定給草稿數據，簡化了處理不可變的數據結構。

使用方法：

1.	npm install  immer
2.	import produce from immer’

3. produce(currentState, (draftState) => void): nextState

將return下巢狀狀態值更改為

Return  produce(state,(draft)=>{

   draft.list.data = action.payload
})
    default:{
       return state
    }

produce函數包含二個參數：
1.currentState
2.回調函數，回調函數中的draft屬性，根据 currentState 生成的草稿状態，它是 currentState 的代理，对 draftState 所做的任何修改都将被记录并用于生成 nextState ，將action.payload指定給draftState，生成的最终状态。