Question

我正在努力做到这一点，以便每次我的搜索字段发生变化时，useEffect中的代码都会执行。但是，只有console.log('hi')正在执行，其他代码均未执行。

我不知道为什么useEffect有选择地运行代码。为什么会这样？

  useEffect(() => {
    console.log('hi')
    const filteredMonsters = monsters.filter(monster => {
      console.log('hi2')
      monster.name.toLowerCase().includes(searchField.toLowerCase());
    })
    setMonsters(filteredMonsters);
  }, [searchField])

在页面加载后，我的控制台将按预期读取'hi'。在搜索框中输入值后，我会在控制台中看到以下内容：

hi

hi2

在搜索框中输入其他值后，我只会看到：正在添加hi，而不是hi2

Answer 1

您应该从过滤器函数中返回一些内容，将其更改为以下内容：

useEffect(() => {
    console.log('hi')
    const filteredMonsters = monsters.filter(monster => {
     return monster.name.toLowerCase().includes(searchField.toLowerCase());
    })
    setMonsters(filteredMonsters);
  }, [searchField])

UseEffect仅触发某些部分？

1 个答案: