栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 面试经验 > 面试问答

在React中使用componentWillMount或componentDidMount生命周期函数进行异步请求

面试问答 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

在React中使用componentWillMount或componentDidMount生命周期函数进行异步请求

React docs建议使用

componentDidMount
发出网络请求

componentDidMount()
挂载组件后立即调用。需要DOM节点的初始化应该在这里进行。如果需要从远程端点加载数据,这是实例化网络请求的好地方。

调用

setState()
此方法将触发额外的渲染,但是可以保证在同一刻度内刷新。这样可以保证,即使
render()
在这种情况下将调用两次,用户也不会看到中间状态。

根据情况

componentWillMount

编辑:

这个生命周期废弃了,因为

v16.3.0
的反应,并且不再鼓励usage.However其重命名为
UNSAFE_componentWillUpdate
和至少预计工作到
V17 的反应

v16.3.0之前

在呈现发生之前,将不会返回异步调用以获取数据。这意味着组件将使用空数据至少渲染一次。

无法“暂停”渲染以等待数据到达。您不能

componentWillMount
setTimeout
某种方式退还诺言或争执。处理此问题的正确方法是设置组件的初始状态,以使其对渲染有效。

把它们加起来

实际上,

componentDidMount
由于两个原因,这是发出调用以获取数据的最佳位置:

  • 使用DidMount可以清楚地表明,只有在初始渲染之后才会加载数据。这提醒您正确设置初始状态,以免最终
    undefined
    导致出现错误的状态。
  • 如果您需要在服务器上呈现您的应用程序,
    componentWillMount
    则实际上会被调用两次-一次在服务器上,再一次在客户端上-这可能不是您想要的。放入数据加载代码
    componentDidMount
    将确保仅从客户端获取数据。


转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/418929.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号