Question

我尝试使用 useEffect 钩子调用一个函数超过 2 次，但结果它只在最后一次调用时调用该函数。

这是我的代码并尝试：

 const [ selectValues, setSelectValues ] = useState([]);
 const selectHandler = (e) => {
 const filteredValues = selectValues.filter((i) => i.id !== e.id);
     setSelectValues([ ...filteredValues, e ]);
  }; 

useEffect(() => {
  const obj1 = {...}
  const obj2 = {...}
  selectHandler(obj1)
  selectHandler(obj2) // this is the only object will be saved to the state
},[])

我希望这个问题得到正确解释

Answer 1

为了能够保存状态中的任何中间值，您应该以回调方式更新它，因为 selectValues 包含呈现组件时存在的值（在我们的示例中为初始值）。

const selectHandler = (e) => {
  setSelectValues((prevValues) => [...prevValues.filter((i) => i.id !== e.id), e]);
};

多次使用 useEffect 响应调用函数

1 个答案: