react的useEffect
时间: 2023-12-01 17:41:21 浏览: 215
`useEffect` 是 React 中的一个 Hook,它可以让你在函数组件中执行副作用操作。副作用操作指的是那些不直接与组件渲染相关的操作,例如数据获取、订阅事件、手动操作 DOM 等。
`useEffect` 接收两个参数,第一个参数是一个函数,这个函数会在组件渲染时执行。第二个参数是一个数组,它用来指定哪些状态变量发生变化时需要重新执行第一个参数中的函数。
以下是 `useEffect` 的几个常见用法:
1. 执行一次性操作,相当于 componentDidMount:
```javascript
import { useEffect } from "react";
useEffect(() => {
console.log('页面渲染完成');
}, []);
```
2. 执行清理操作,相当于 componentWillUnmount:
```javascript
import { useEffect } from "react";
useEffect(() => {
return () => {
console.log('组件卸载');
}
}, []);
```
3. 监听状态变化,相当于 componentDidUpdate:
```javascript
import { useEffect, useState } from "react";
const [count, setCount] = useState(1);
useEffect(() => {
console.log('执行了');
}, [count]);
```
阅读全文