我的待办事项清单

概述

我的待办事项列表是一个提高效率的应用程序，允许我们将每日任务添加到任务列表中，并在完成任务后选择性地删除。

为了获取用户的输入，我们将添加一个 Input 组件，其中包含一个 input 元素，用于输入任务内容。按下“Enter”键即可添加任务。添加 Input 组件后，输入的值将通过 props 传递给 ToDoList 组件。props 用于将数据从父组件传递到子组件，并以 CSS 网格格式显示任务内容。

我们将使用 nanoid 为 key 属性生成唯一值。key 属性帮助 React 识别哪些项目发生了变化、新增或被移除。

你可以在下方尝试最终的应用程序。

我们将使用 localStorage 来存储和读取数据。这可以将任务列表保存在本地存储中，即使页面刷新也不会丢失。我们还将创建一些函数，例如 onChangeHandler 用于处理任务输入值的变化，以及 onDeleteHandler 用于从 todo 列表中删除选定的项目。