时间戳

首页 > 解决方案 > 如何更新其他组件中数组列表中的项目

reactjs - 如何更新其他组件中数组列表中的项目

问题描述

我正在使用 Redux 构建一个 Todo 应用程序。我只构建创建和删除。

我想构建一个<Edit />待办事项的消息将出现/编辑<TodoForm />。

我怎样才能做到这一点 ？

<>
  <TodoForm />
  <TodoList />
</>

我想我要把本地状态（useState）转移到全局状态（redux）。

有什么申请技巧吗，求推荐

PS 网上的教程大多只是简单的添加、删除todo的任务，并没有覆盖编辑。这就是我想要的

我的密码箱： https ://codesandbox.io/s/upbeat-darkness-miibs

标签： reactjs

解决方案

根据您在上面提供的信息，我们能得到的信息不多。无论如何，我只是在这里猜测：-

  • 现在，您已将所有表单 state声明为组件内的本地 表单。stateTodoForm
  • 你只有一个全局 state来保存所有的待办事项列表。最好在一个array

我建议只是： -

  • 在组件中创建一个新的本地 state组件TodoForm，它可以执行您想要的编辑功能。（例如const[isEdit, setIsEdit] = useState(false)：）
  • 创建一个function运行编辑事件（当然这个事件应该反映/更新你的全局 待办事项）state array
  • 创建一个button以在事件上方运行并从更改 为（我们使用它来提供取消编辑的能力）。单击编辑按钮后，使用您要编辑的当前数据更新/填充所有字段（如果您想取消编辑，则创建一个仅在等于时出现的取消按钮。如果单击，则重置回并取消填充当前来自所有占位符的数据）isEdit statefalsetrueinputisEdit statetrueisEdit statefalseinput

推荐阅读