使用过滤器和挂钩的搜索功能

Question

我正在尝试关于udemy的反应课程，但是我使用的是钩子而不是讲师显示的类和状态。这是一个简单的应用程序，我可以在其中下载随机的userinfo和图像，并使用闪存卡显示它们。

然后，我需要能够搜索/过滤用户。我设法通过使用两个不同的useEffects使其工作，但是我想知道这是否是解决此问题的正确方法。还有，如果我能获得有关如何改进当前代码的任何提示。

Project on codesandbox

Answer 1

没关系。但是，您不需要使用第二个useEffect。您可以直接在函数主体中计算过滤器。如果要缓存结果，可以使用useMemo挂钩，但这在这里是不必要的。

基本上我要做的是：

const filter = users && users.length ? users.filter((person) =>
        person.name.toLowerCase().includes(searchField.toLowerCase())
      ); || []