00:00
好嘞,各位,那截止到目前呢,我们就把旧版本的生命周期钩子呢,全都过了一遍,必须得来个总结,这么多的东西不可能所有人都按照一定的要求去掌握,对吧,肯定得有侧重的,好,那我们慢慢来啊,先关掉这个图,然后呢,我把这折叠一下啊,这是count组件,这是父组件A,这是子组件B,我是为了掩示父子之间那个关系,说那个view receive props,我写的A和B对不对啊,写好了叫做父组件谁呢?A,然后这呢,写一个叫做子组件啊,这是第一次跟大家说父子的关系啊,子组件谁呢B,那同学自己下去,如果看我代码的话呀,你这儿啊要动态的调一下,OK,你想看之前说的那些,哎,看这个,想看那个will receive props,那就把A写在这好吧,嗯,那我这儿呢,先写成这个count,嗯,走好,回到课件里呢,我们去。
01:00
看一下啊同学课件里呢,已经给大家写好了这个总结来吧,生命周期呢,其实大体分为三个阶段,一个叫做初始化,一个叫做更新,一个叫做卸载,我们把这些东西呢,都给它粘过来,复制来到我们的代码当中,我给你放在最上方啊同学,东西多不怕的,有理有据的把重点拎出来就可以啊,粘过来缩进啥的呢,我调一调啊,来走走走走。然后这儿呢,得往里动往外提,往里动往外提,为了分割明显一点,我多往里缩进缩进啊,那这个呢,也是好了,同学来整体看吧,首先第一个阶段呢,就是初始化阶段,同学,这个初始化阶段呢,是由react do.render出发的,对吗?同学你想一下,如果你不执行react do.render那一切就都别谈了,你都没调render,那组件都不用是吧?哎,也就是初次渲染调构造器,不will mount,不render data mount,对吗?这是初始化阶段组件第一次挂载,好,那再说更新阶段,由于组件内部呀,你掉了set state,或者说怎么的呢?你重新,哎,让副组件render。
02:22
啊,或者说咱也不说重新这俩字,咱就说父组件render同学,我问你啊,你看咱们的案例,这是不是父,这是不是子,你在负里边是不是掉了set state,是不是引起了负里的状态的改变,负里的状态只要一改变,负的render是不是就得掉?那负的render里面你还写了子的标签,那你说子是不是也得重新,哎,Render一下呀,好,那走更新阶段,就是要么是你自己set state了。哎,要么就是咋的,你副组件render了这两个情况去出发,然后就问这个阀门,然后就将要更新render,然后完成更新,但是这个里边同学没有体现出来一个东西,谁呢?就是那个强制更新对不对?同学,强制更新其实就是少了这个环节,对吧,那个强制更新啊同学其实呢,用的不多,你别急,同学就这么多的生命周期钩子,我告诉大家到了工作岗位上就三个钩子常用啊,慢慢来,再往下,然后就是render了,然后就是data update更新完毕了,好,再往下就是卸载组件,那由谁出发呀?卸载组件没别的办法,就是react do.on mount component at note,你调这个的时候出发。
03:36
然后呢,就走了一个组建将要卸载,有些同学呢,可能发出一个疑问,老师,我有一个小小的疑问。你有will mount,你就有date amount,你有will update,你就有date update,那你有view on mount,你怎么没有date on mount呢?因为设计date on amount意义不大,同学你想一下,咱就开玩笑的说,人是不是都在将要不行的时候,那安排点后事啊,那你说举个例子,同学这人已经凉了是吧?哼,他都完了,那你说那还有什么意义呢?设计这个钩子对不对?哎,所以说他没设计这个啊,那关掉,那这就是诶三个阶段,同学你觉不觉得这三个阶段跟人类社会也是一样的呀,初始化阶段,那就是你出生对吧?你第一次来到这个,哎,人世间是吧?哎,那这个更新阶段呢,那就是你在生活呀,学习呀这些过程当中啊,你的人生经历对不对啊,今儿又学会说话了,明儿又学会走路了等等这些更新对吧?哎,上学了,结婚了,娶妻生子了对不对?好,那你说卸载组建呢,那不说你说我对吧,那就是我要凉了,诶就这回事儿对吧,啊说老师那这些钩子哪个常用呢,同学,我把常用的后边呢给你加。
04:57
点东西首先有一个人呢,比较常用就是data amount,哎,这个人呢,比较常用,明确说啊,常用说老师他怎么常用呢,你想想我们做这个案例的时候,就引出生命周期的时候啊,你打开。
05:14
页面一上来就做点事,就特别适合用data mount同学,页面一上来加载100个学生信息对不对?页面一上来就定位,看这个用户当前所处的经纬度对不对,用户一上来就加载一个动画,有很多这种场景,就是页面一上来就怎么怎么样,那所以说我们就特别适合用这个钩子,就是data mount非常的常用啊,那一般呢,在这个钩子中做什么呢?做一些呀,初始化的事儿,嗯,我接下来的注释呢,越写越多,所以说我这样,我先说的常用,然后我再缩进一下,说在这里边干嘛啊,那一般呢,在这个钩子里呢,做一些初始化的事儿,嗯,逗号,例如什么呢?开启定时器或者是什么呢?发送网络请求,哎,或者是什么呢,我。
06:15
那么后边要讲的叫订阅消息,哎等等这些初始化的事儿呢,都在这儿做,哎这是比较常用的,还有一个人也很常用,就是不有amount,那在这个里边呢,我们一般做一些收尾的事儿,哎复之一般在这个钩子中做一些。收尾的事儿,收尾的事儿就是善后工作,那例如来吧,你之前是不是开定时器了呀?嘿,那我在这儿怎么的,那就关定时器呗,定时器不能不关呀,哎,写好了叫做关闭,诶关闭定时器啊,那你能订阅消息,那我这儿就能取消订阅消息,说老师那网络请求,那你都发出去了咋着那在这还后悔了是吧?哎,那没有这个,所以说一般都做一些收尾的事儿,同学。
07:10
你怎么能把这东西记住呢?那你想一下啊,同学,你说在人类社会中这个data amount组建的data amount,你觉不觉得就是人类社会中的孩子出生那天组件挂载到页面了,就是这个婴儿呱呱坠地了,对吗?这是个大日子吧,那干嘛呀?哎呀,给你起名啊对不对?怎么的啊,这给你哎呀买车呀,买房是吧,可能说质问的比较早是吧?哎,也就是说孩子一落地来吧,初始化的事儿都得开始做了,对不对啊,还有人类社会中另外一个大日子。是不是你若乘风归去那一天呀,对吧?同学,你说一个是出生那一天,一个是即将要离开那一天,是不是都是人类社会中的大日子,那么在组建的一生当中,这两个点也是大日子,在这儿做初始化的事儿,在这做收尾的事儿,那其实你忽略了一个一直伴随你的人,那就是render。
08:14
那不是常用啊,它是必须要用啊是吧?同学没有了render,那组件还有什么意义呢?好,那就把这个旧版本的生命周期呢给大家总结了一下,别急,下一小节呢,我们去学习新的生命周期钩子,说我说那其他那些我怎么把控呢?同学听我说学习的时候,你自己也能够像我讲的时候那样,一个一个去把他们验证一下,说这阀门,哎,我真的我试试,我关了我开了这些对不对,哎,去试试,还有这些钩子呢,都在合适的时候,哎,你打印一下log啊去看一看,然后呢,同学你没发现这图里边有两个人,它就颜色就特殊,是不是一个这个是不是一个这个学的时候都得验证,都得过一遍,都得学,那真正用的时候,Render data amount will on mount用的最多,好,那我们这小节呢,听一下。
我来说两句