Comments (6)
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.
Related Issues (18)
- React 超详细入门知识 HOT 1
- 从零到一实现 react-redux
- 通俗易懂的 React Fiber 实现教程
- TypeScript 高级类型及用法 HOT 5
- 使用 Vite 尝鲜 React 18
- React 18 新特性(一):自动批量更新
- React 18 新特性(二):Suspense & SuspenseList HOT 1
- React 18 新特性(三):渐变更新
- React18 + VITE 在配置 antd时, Select组件下拉菜单栏不显示 HOT 1
- Vue3:watch 使用场景及常见问题
- React 中 Context 用法详解 HOT 2
- React 类组件生命周期详解
- React PureComponent 使用注意事项以及源码解析
- React Hooks 用法详解
- 轻松掌握 Redux 核心用法
- 十分钟学会 react-redux
- 从零到一实现 Redux
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from blog.