Javascript 为什么我在react redux中的更新使用我所做的更新创建新数据，而只是编辑它？

我不知道为什么我的更新表单正在使用我传递给它的项重新创建一个新数据来编辑一个已经存在的项，而且，组件不会重新加载以显示新状态。我必须刷新它才能看到更改，但我在单击提交后立即在我的redux chrome inspector上看到更改

在我所做的工作中，我使用了useEffect钩子来监听editForm状态的变化

完整的代码也在我的gitHub上，是一个非常简单的代码

这是密码

EditForm component

import React, {useState, useEffect} from 'react'
import {connect} from 'react-redux'
import {taskEdit} from '../action/taskAction'

function TaskEditForm(props) {

  const [task, setTask] = useState(props.task)

  useEffect(()=>{
    setTask(props.task)
  }, [props])
  
  const handleChange = e => {
    setTask({
      ...task,
      name : e.target.value
    })
  }

  const handleSubmit = (e) => {
    e.preventDefault()
    const {name} = task

    const newTask = {
      name
    }

    props.taskEdit(task._id, newTask)
    props.isEditing(false)

  }

  return (
    <form onSubmit={handleSubmit}>
      <input type="text"  value={task.name} onChange={handleChange} />
      <button>Edit</button>
    </form>
  )
}

export default connect(null, {taskEdit})(TaskEditForm)

Reducer

 case TASK_UPDATE:
      return {
        ...state,
        tasks : state.tasks.map(task=>{
          if(task.id === action.payload.id){
            return Object.assign({}, task, {
              name : action.payload.task
            })
          } else {
            return task
          }
        })
      }


Action 

export const taskEdit = (id, task) => dispatch => {

  const req = {
    method : "POST",
    headers : {"Content-Type":"application/json"},
    body : JSON.stringify(task)
  }

  fetch('http://127.0.0.1:5000/task/add', req)
  .then(res => res.json())
  .then(data => dispatch({
    type : TASK_UPDATE,
    payload : {
      id,
      task
    }
  }))

}

EditForm组件
从“React”导入React，{useState，useEffect}
从“react redux”导入{connect}
从“../action/taskAction”导入{taskEdit}
函数TaskEditForm（道具）{
const[task，setTask]=useState（props.task）
useffect（（）=>{
设置任务（道具任务）
}[道具]）
常量handleChange=e=>{
设置任务({
任务
名称：e.target.value
})
}
常量handleSubmit=（e）=>{
e、 预防默认值（）
常量{name}=task
常数newTask={
名称
}
道具任务编辑（任务id，新任务）
道具编辑（错误）
}
返回(
编辑
)
}
导出默认连接（null，{taskEdit}）（TaskEditForm）
减速器
案例任务更新：
返回{
……国家，
任务：state.tasks.map（任务=>{
if（task.id==action.payload.id）{
返回Object.assign（{}，task{
名称：action.payload.task
})
}否则{
返回任务
}
})
}
行动
导出常量任务编辑=（id，任务）=>dispatch=>{
常数要求={
方法：“张贴”，
标题：{“内容类型”：“应用程序/json”}，
正文：JSON.stringify（任务）
}
取（'http://127.0.0.1:5000/task/add，req）
.then（res=>res.json（））
.然后（数据=>dispatch({
类型：任务更新，
有效载荷：{
身份证件
任务
}
}))
}

---

完整的代码也在我的gitHub上，是一个非常简单的代码。

React中的更新就是这样工作的。一般来说，您返回一个新的对象引用，而不是仅仅修改现有的对象引用，以便组件重新加载。您可能需要刷新以查看更新的数据，因为

TaskEditForm

仅从redux获取

taskEdit

。是否有订阅存储区的某个父组件正在传递更新的道具对象，该对象具有更新的

任务
道具值？是，我从taskDetail组件传递了数据，因为我不知道如何将单个项目传递到编辑组件。是否介意更新您的问题以包含父组件代码，以便我们可以看到如何维护
任务
值并将其作为道具传递？发现了一个缺陷<代码>名称：action.payload.task
应为
名称：action.payload.task.name
。对吧？我想如果你能具体说明道具中到底包含了什么，会更好。像useffect中的
函数TaskEditForm（{task，isEditing，…}）{
[props]
可以替换为
[props.task]
。