reacd useEffect
时间: 2023-07-19 19:15:28 浏览: 113
`useEffect` 是 React Hooks 提供的一个函数,用于处理组件的副作用。副作用包括但不限于:数据请求、订阅事件、操作 DOM 等。在函数组件中,由于没有生命周期函数,我们需要使用 `useEffect` 来处理副作用。
`useEffect` 接收两个参数:第一个参数是一个函数,这个函数会在组件挂载、更新、卸载时被调用;第二个参数是一个数组,用于指定依赖项,只有这些变量发生变化时,副作用才会被触发。
示例代码:
```
import React, { useState, useEffect } from 'react';
function Example() {
const [count, setCount] = useState(0);
useEffect(() => {
document.title = `You clicked ${count} times`;
}, [count]);
return (
<div>
<p>You clicked {count} times</p>
<button onClick={() => setCount(count + 1)}>
Click me
</button>
</div>
);
}
```
在这个示例中,每次点击按钮都会改变 `count` 的值,`useEffect` 中的函数会重新执行,将当前点击次数更新到页面的标题中。由于我们将 `count` 作为第二个参数传入,所以只有 `count` 发生变化时,`useEffect` 才会重新执行。
阅读全文