初识ReactHook—— useEffect

要弄清楚这个钩子函数，你首先需要了解react的生命周期原理。

我直接放这张图肯定会有新手直接傻眼，这什么鬼玩意啊？因为我刚学到生命周期的时候也是一脸懵逼，通过实际例子来看！

下面是我个人博客首页左侧轮播图的效果实现，手机端效果隐藏了，手机端看不到效果。推荐电脑端看一下。：https://hanzhenfang.vercel.app/https://hanzhenfang.vercel.app/

刚学到这里的时候，我第一反应是简单，我用uesState这个钩子不就行了吗？

是，谁去调用呢？你这个方法写在这里，没人用啊？你说，我加个按钮不就行了吗？

是，你加个按钮可以点击一下然后开始实现换图片的效果，但是客户需求就是你进去网页图片自动就换，你怎么办呢？

首先我们要有一个概念，我们是需要用户点击博客页面，图片就随着时间开始变化的。

很遗憾，单纯的useState是完成不了任务的。这时候我们就需要用到类似于class组件里的 componentDidMount 不得不说React在起名字的时候真的是把语义话做到了极致。Did，有点英语常识的都知道did是过去式，组件didMount，组件已经挂载好了

大白话就是我组件已经渲染好了，你需要我干什么？巧了嘛，我需要你帮我运行我的SetInterval啊

但是突然回过神来，那是人家类组件的专属钩子函数，我们是函数组件啊。别怕，useEffect来了。

useEffect接收两个参数(一个参数是你希望在页面渲染完成以后立即执行的函数，第二个是参考对象)如果你写入空数组，那么useEffect就相当于只执行一次，因为参考对象空数组永远也不会发生变化，如果你写了count，那么你的意思就是count更新，就会调用useEffect。这时候就会陷入一个误区。为了方便看，我清除了一部分内容，后面再讲。

ok，我们把刚刚写好的函数放进去，好了，可以正常执行了。刚开始我也是这样想的，网上的教程视频说的需要清除计时器，我就在想，我清除干嘛啊，这不是已经可以满足我的需求了吗？当我自己写博客页面的时候，我才知道这是为什么。我们要知道react是一个单页面应用，我在代码中加了一个console.log（"计时器还在运行"）