React Hooks 常见问题及解决方案 about blog HOT 6 OPEN

useEffect 没有加 deps 参数，组件每次渲染都会绑定一次点击事件，你加到5的试试，就会绑定5次，然后就会输出 5次

from blog.

很好的文章 可以补充一下 useCallback ref

from blog.

好全面啊，star

from blog.

@panw3i 好的👌🏻

from blog.

useEffect(() => {
    const handleClick = function() {
        console.log('count: ', count);
    }
    window.addEventListener('click', handleClick, false)
});

return <p onClick={() => setCount(count + 1)}>clicked {count} times</p>;

为什么 count：5 的时候就就打印了 5次呢？

from blog.

useEffect(() => {
    const handleClick = function() {
        console.log('count: ', count);
    }
    window.addEventListener('click', handleClick, false)
});

return <p onClick={() => setCount(count + 1)}>clicked {count} times</p>;

为什么 count：5 的时候就就打印了 5次呢？

@hwx98 如楼上所说，useEffect 没有 deps 参数，那么在第一次渲染及后面的每次更新时，都会执行。所有每次走 useEffect 的时候，按照这里的逻辑，都会绑定一个 click 事件，也就意味着 count 到 5 的时候，绑定了5 次，所以再次点击，就会打印五次了。

from blog.