使用嵌套的對象數組更新狀態

Question

這也稱爲深度更新。我必須更新嵌套狀態數組。

我正在實施一個簡單的REDX應用程序。這裏我想更新嵌套對象數組的狀態。我的reducer功能需要狀態，動作。我必須用新的價值更新國家的迴應財產。我試圖映射/迭代狀態，但它不適合我。有沒有辦法更新這些特定的值並返回更新狀態。

const sampleData = [{ 
    "id": 1, 
    "text": "Hobby", 
    "answers": [{ 
    "id": 1, 
    "text": "Chess", 
    "responses": 5 
    }] 
}]; 

const action = { 
    type: "VOTE", 
    questionId: 1, 
    answerId: 3 
}; 

這是handleSubmit函數我正在調用提交按鈕單擊窗體上。

handleSubmit(e){ 
    const store = createStore(hobbyReducer, hobby); // created store here 
    var k = (document.querySelector('input[name = "hobby"]:checked').value); 

    store.dispatch({type:"SUBMIT", text: k, id: 1}); // Dispatching action to reducer 
    store.subscribe(()=>{ 

     console.log(store.getState()); 
    }); 
} 

這裏是節目的一部分減速器：

function hobbyReducer(state, action) { 
    switch(action.type){ 
     case "SUBMIT": 
      return{ 
       ...state, 
       answers: state.answers.map(e=> (e.text === action.text && e.answers.id === action.id)? 
       { ...answers, 
       responses: (e.responses+1)} : 
      hobby) 
      } 
     break; 
     default: 
     return state; 
    } 
} 

初始狀態=的sampleData; //定Array對象上面

我無法更新的響應特性是在一個嵌套數組

這是我想寫的代碼，我終於做到了需要什麼樣的一些研究之後。儘管這在時間複雜性方面不是解決方案。

`

case "SUBMIT": 
     const updatedState = state.map(e =>{ 
      if(e.id === action.id) 
      return{...e, 
        answers: e.answers.map(f =>{ 
       if(f.text === action.text){ 
       return{ 
        ...f, 
        ...{responses: f.responses + 1}, 

       } 
       } 
       return f; 
      }) 
      } 
     return e; 
     }) 
     console.log("updatedstate", updatedState) 
     return updatedState 

Answer 1

只需在地圖中的錯誤，我認爲：

function hobbyReducer(state, action) { 
    switch(action.type) { 
     case "SUBMIT": 
     return { 
      ...state, 
      answers: state.answers.map(answer => { 
      if (answer.text === action.text && answer.id === action.id) { 
       answer.response = answer.response + 1; 
      } 
      return answer; 
      }); 
     } 
     default: 
     return state; 
    } 
}