状態値を再初期化せずに更新状態を更新する

Question

私はreactとreduxを使用してtodolistアプリケーションを作成しています。しかし、私は状態を更新する問題に直面している。

import { GET_TASKS, GET_TASKS_ERROR } from '../constants'; 

export function gettasksReducers(state = { tasks: [], getTasksError: {} }, action) { 
    switch (action.type) { 
     case GET_TASKS: 
      return { 
       tasks: action.payload 
      } 
      break; 
     case GET_TASKS_ERROR: 
      return { 
       getTasksError: action.payload 
      } 
      break; 
     case 'UPDATE_TASKS': 
      console.log('inside the update tasks case---'); 
      return [...state.tasks, action.payload] 
      break; 
    } 
    return state; 
} 

ここで、GET_TASKSのケースは、状態オブジェクト内のタスク配列にペイロードを割り当てます。しかし、同じ減速器にあるUPDATE_TASKSを呼び出そうとすると、タスク配列が未定義に更新されます。ここでのアクションコードを見つけてください：私はDBにタスクを追加した後に「UPDATE_TASKS」を派遣/呼び出しています

import axios from 'axios'; 
import { UPDATE_TASK } from '../constants'; 

export function updateTask(txtTask) { 
    return { 
     'type': UPDATE_TASK, 
     'payload': txtTask 
    } 
} 

export function addTask(txtTask) { 
    return function (dispatch) { 
     axios.post('http://localhost:3000/api/tasks', { 
      name: txtTask 
     }) 
      .then((response) => { 
       dispatch({ 'type': 'UPDATE_TASKS', 'payload': response.data }); 
      }) 
      .catch((error) => { 
       console.log(error); 
      }); 
    } 
} 

。状態のタスクを更新するためにもう一つの減速機を作る必要がありますか？提案してください。それはDBに追加タスクオブジェクトとタスクの配列を更新している

case 'UPDATE_TASKS': 
    return { 
     tasks: [...state.tasks, action.payload] 
    } 

： おかげ

Answer 1

おかげアムル、 は、それはそれを修正した後に働きました。 ありがとう