React componentwillmount和componentdidmount请求数据

栏目: IOS · Android · 发布时间: 5年前

内容简介:这个方法正确调用的时候是在component第一次render之前,所以第一眼看上去觉得就应该在这里去fetch datas.但是这里有个问题,在异步请求数据中这一次返回的是空数据(null),因为是异步的,请求需要时间,但render不会等你慢慢请求.所以在渲染的时候没有办法等到数据到来.正确的处理方式就不要在这里请求数据,而是让组件的状态(state)在这里正确的初始化.

1.清楚调用顺序

React componentwillmount和componentdidmount请求数据

2.componentWillMount的问题

这个方法正确调用的时候是在component第一次render之前,所以第一眼看上去觉得就应该在这里去fetch datas.

但是这里有个问题,在异步请求数据中这一次返回的是空数据(null),因为是异步的,请求需要时间,但render不会等你慢慢请求.所以在渲染的时候没有办法等到数据到来.正确的处理方式就不要在这里请求数据,而是让组件的状态(state)在这里正确的初始化.

顺便说一句在es6中,使用extend component的方式里的constructor函数和componentWillMount是通用的作用,所以你在构造函数里初始化了组件的状态就不必在WillMount做重复的事情了.

3.componentdidmount的优点

componentDidMount呢?这个生命周期函数在是在render之后调用一次,component已经初始化完成了.

在生产时,componentDidMount生命周期函数是最好的时间去请求数据,其中最重要原因:使用componentDidMount第一个好处就是这个一定是在组件初始化完成之后,再会请求数据,因此不会报什么警告或者错误,我们正常请教数据完成之后一般都会setState.


以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

风口上的汽车新商业

风口上的汽车新商业

郭桂山 / 人民邮电出版社 / 59

本书从互联网+汽车趋势解析、汽车电商困局突围策略、汽车后市场溃败求解等三个篇章详细阐述了作者的观察与思考,当然更多的还是作者在汽车电商行业的实践中得出的解决诸多问题的战略策略,作者站在行业之巅既有战略策略的解决方案,同时也有战术上的实施细则,更有实操案例解析与行业大咖访谈等不可多得的干货。当然,作者一向追崇的宗旨是,书中观点的对错不是最重要的,重在与行业同仁探讨,以书会友,希望作者的这块破砖头,能......一起来看看 《风口上的汽车新商业》 这本书的介绍吧!

JS 压缩/解压工具
JS 压缩/解压工具

在线压缩/解压 JS 代码

JSON 在线解析
JSON 在线解析

在线 JSON 格式化工具

RGB转16进制工具
RGB转16进制工具

RGB HEX 互转工具