尝试使用反应钩子设置状态，但我得到的是一个空数组 [关闭]

Question

关闭。 这个问题需要更加集中。 它目前不接受答案。

---

想改善这个问题吗？ 更新问题，使其仅通过编辑这篇文章来关注一个问题。

10 个月前关闭。

改进这个问题

正如你所看到的，我对 React.js 还很陌生。 在这里，我正在尝试创建一个待办事项列表应用程序。 它的顶部应该有三个按钮——一个用于显示已完成的任务，第二个用于显示未完成的任务，最后一个显示列表中的所有任务。 所以，我需要两个列表 - 一个用于添加到列表中的每个项目，另一个用于过滤我猜。 问题是在这种情况下我无法掌握状态并且我的过滤器数组是空的。 我不想直接改变状态，但尝试了很多事情，我不得不做错某事。 这是第一个按钮的代码。

我想单击按钮，重新渲染站点并获得过滤项目列表。

 //todos, setTodos are for my primary state

 const TodoFilter = ({ todos, setTodos}) => {

 const [filter, setFilter] = useState([])

 const handleActive = () => {
 const allTodos = [...todos]

 const completedFilter = allTodos.filter(item => item.isComplete === true)   

 setFilter(completedFilter)

 }

Answer 1

您的代码丢失了很多，所以不确定这是您到目前为止编码的所有内容还是您没有包含其他一些位。 在清除它们之前，您需要添加一个复选框来检查已完成的待办事项。

请尝试使用以下代码从未完成的待办事项中过滤已完成的待办事项，并假设您有一个按钮可以清除它。 希望这可以帮助

function handleCleartodos() {
const completedFilter = allTodos.filter(item => !item.isComplete)
setFilter(completedFilter)
}

<button onClick={handleCleartodos}>Clear Todos</button>