Question

要了解自己的反应本机，我正在构建一个应用程序，其中包含一个包含Redux的门票的FlatList。当我尝试通过输入数字来筛选票证时，列表会被筛选，但仅持续1秒。之后，它将再次给出所有票证的列表。我很难找到我的初学者代码背后的逻辑错误。任何帮助将不胜感激。

我粘贴了以下列表：

_list = Profile.objects.all()

Answer 1

问题出在您的第二个useEffect钩子上：

useEffect(() => {
  setDisplayedTickets(allTickets);
});

此效果将在每次重新渲染时将displayedTickets设置为allTickets。

这就是发生的事情：
1.筛选故障单时，您正在更改状态，并将displatedTickets设置为已过滤的故障单：setDisplayedTickets(foundTickets);。
2. displayedTickets已更新，该组件已重新渲染，您会看到新的票证一秒钟，并且在重新渲染该组件后，该效果就会再次执行并设置{{1} }再次移至displayedTickets：allTickets。

这是我的建议：
1.删除第二个setDisplayedTickets(allTickets);-这将阻止在每次重新渲染时将useEffect再次设置为displayedTickets。 2.在您的单位列表中，将数据更改为allTickets。这样，当票证将不被过滤时-列表将显示displayedTickets || allTickets，并且一旦您对其进行过滤，列表将显示allTickets。

因此，您的最终代码应如下所示：

displayedTickets

反应本机重新渲染求反滤波器

1 个答案: