由于函数组件没有生命周期，可以使用 useEffect 来替代，他可以看做是 componentDidMount、componentDidUpdate、componentWillUnmount 这三个函数的组合。

/* 
	useEffect不传参数，相当于类式组件中的componentDidMount生命周期和componentDidUpdate生命周期，
	在挂载完成执行一次，任何状态更改时也会执行
*/
import React, { useState, useEffect } from 'react';
 
export default function Page2 () {
	const [count, setCount] = useState(0);

	useEffect(() => {
		getDatas ()
	})

	const getDatas = () => {
		let arr = [134,2345,355,46]
		console.log('arr', arr)
	}

	return(
		<div>
			<p>You clicked {count} times</p>
			<button onClick={() => setCount(count + 1)}>按钮</button>
			<div>This is Page2!</div>
		</div>
	);
}

这里，在页面初次加载完会执行 getDatas 方法，控制台会打印出数据，每次点击按钮更新 count 后，控制台会依次执行 getDatas 方法打印出数据。

如果想通知 React 跳过对 effect 的调用，可以传一个空数组作为 useEffect 的第二个参数，这样就只会运行一次 effect。

/*
	此时，相当于类式组件中的componentDidMount生命周期,只会在挂载完成执行一次
 */
useEffect(() => {
	getDatas ()
}, [])

同样的，如果某些特定值在两次渲染之间没有发生变化，可以通知 React 跳过对 effect 的调用，比如只有 count 属性变化时才去调用 effect，其他情况下不调用 effect，此时相当于类式组件中的 componentDidMount 和 componentDidUpdate 生命周期。

// 组件挂载完会调用，，count更改后也会调用
useEffect(() => {
	getDatas ()
}, [count])

如果 useEffect 里返回一个回调，如下：

/*
	此时，useEffect相当于类组件中的componentDidMount、componentDidUpdate、componentWillUnmount生命周期，
	页面加载完会执行、组件状态更改后也会执行，在组件将要卸载时也会执行
 */
let listData = [
	{
		name: "张三",
		age: 34,
		id: 1
	}, {
		name: "李四",
		age: 23,
		id: 2
	}, {
		name: "王五",
		age: 45,
		id: 3
	}
]
let [list, setList] = useState(listData)

useEffect(() => {
	const timer = setInterval(() => {
		setList(list.map(item => {
			return {
				...item,
				age: item.age + 1
			}
		}))
	}, 1000)
	return () => {
		clearInterval(timer)
	}
})