小编Оре*_*кий的帖子

无限循环React挂钩

我不明白为什么useClick中会出现无限循环, 我看到我使用setVal更改了useEffect中的状态值,但useEffect应该仅在第二个参数中指定的onClick上起作用。我认为这是因为我传递的参数onClick被记录下来,但未调用回调(我使用console.log('go set'检查过)

function useClick(onClick, setVal, val) {
  React.useEffect(() => {
    console.log('Click');
    setVal(val + 1);
  }, [onClick]);
}

const Home = () => {
  const [val, setVal] = React.useState(0);
  const incrementOnClick = React.useCallback(() => {
    console.log('go set');
    setVal(val + 1);
  } , [setVal, val]);
  useClick(incrementOnClick, setVal, val);
  return <div>
    <div>{val}</div>
    <button onClick={incrementOnClick}>Click me</button>
 </div>
}
Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-hooks

4
推荐指数
1
解决办法
2724
查看次数

标签 统计

javascript ×1

react-hooks ×1

reactjs ×1