useEffect的基本使用

函数式组件useEffect为模拟class组件的生命周期钩子副操作；

一、class组件钩子：

• componentDidMount： 组件首次渲染完成【更新完dom】；
• componentWillUnmount：组件即将被卸载【dom未被销毁】；
• componentDidUpdate：组件更新完成【更新完dom】（非首次渲染）；

二、function组件钩子：

useEffect(effect, deps);

effect（生成的新函数，获取最新的数据）	effect的return函数（之前生成的函数，获取的之前上下文中的数据）	deps(能够触发组件更新的属性才有效，比如：依赖useRef无效)
1. dom首次渲染完，相当于componentDidMount； 2. dom更新完成后，相当于componentDidUpdate	1. dom被销毁后-获取为null，不同于componentWillUnmount； 2. dom更新完成后，运行第一个effect前统一顺序执行；	不传
dom首次渲染完，相当于componentDidMount；	dom被销毁后-获取为null，不同于componentWillUnmount；	[]
1. dom首次渲染完，相当于componentDidMount； 2. 依赖deps发生变化时，dom更新完成后	1. dom被销毁后-获取为null，不同于componentWillUnmount；2. 依赖deps发生变化时，在dom更新完成后，运行第一个effect前统一顺序执行；	[count, num]

总结

effect 和 return函数 ：

相同点：都是获取的更新完成后的dom；在首次渲染完dom时effect都会执行，销毁dom后return都会执行；

**不同点：useEffect的effect函数每次可以执行时，都是生成的新函数，保证函数内部拿到的是最新的数据。
return返回函数的清除操作，每次使用都是之前被闭包的函数，使用的是 之前函数组件上下文中的数据;