react组件式useEffect

React函数式组件中，useEffect是一个React的Hook函数，用于在函数组件中执行副作用操作。它可以被用来在组件挂载后执行一些操作（相当于`componentDidMount`生命周期），也可以在组件卸载时执行一些清理操作（相当于`componentWillUnmount`生命周期），以及在依赖项发生变化时执行一些操作。通过useEffect可以方便地处理组件的副作用逻辑。

例如，可以使用useEffect来发送AJAX请求、设置定时器、订阅/取消订阅等操作。在useEffect函数的第一个参数中，可以传入一个回调函数，该函数会在组件挂载或依赖项发生变化时执行。在回调函数中，可以进行需要的操作。如果要在组件卸载时执行一些清理操作，可以在回调函数中返回一个函数。这个返回的函数会在组件卸载时执行。

下面是使用useEffect的一些示例：

1. 使用useEffect作为`componentDidMount`使用：

import React, { useEffect } from "react";

useEffect(() => {
  console.log('页面渲染完成');
}, []);

2. 使用useEffect作为`componentWillUnmount`使用：

import React, { useEffect } from "react";

useEffect(() => {
  return () => {
    console.log('组件卸载');
  }
}, []);

3. 使用useEffect监听依赖项变化：

import React, { useEffect, useState } from "react";

const [count, setCount] = useState(1);
useEffect(() => {
  console.log('执行了');
}, [count]);