zoukankan      html  css  js  c++  java
  • React请求数据为什么要在componentDidMount方法里面做?

    转载自:https://segmentfault.com/q/1010000008133309/a-1020000008135702

    这与React组件的生命周期有关,组件挂载时有关的生命周期有以下几个:

    • constructor()

    • componentWillMount()

    • render()

    • componentDidMount()

    上面这些方法的调用是有次序的,由上而下,也就是当说如果你要获取外部数据并加载到组件上,只能在组件"已经"挂载到真实的网页上才能作这事情,其它情况你是加载不到组件的。

    componentDidMount方法中的代码,是在组件已经完全挂载到网页上才会调用被执行,所以可以保证数据的加载。此外,在这方法中调用setState方法,会触发重渲染。所以,官方设计这个方法就是用来加载外部数据用的,或处理其他的副作用代码。

    constructor被调用是在组件准备要挂载的最一开始,所以此时组件尚未挂载到网页上。

    componentWillMount方法的调用在constructor之后,在render之前,在这方法里的代码调用setState方法不会触发重渲染,所以它一般不会用来作加载数据之用,它也很少被使用到。

    一般的从后台(服务器)获取的数据,都会与组件上要用的数据加载有关,所以都在componentDidMount方法里面作。虽然与组件上的数据无关的加载,也可以在constructor里作,但constructor是作组件state初绐化工作,并不是设计来作加载数据这工作的,所以所有有副作用的代码都会集中在componentDidMount方法里。

  • 相关阅读:
    事件委托,元素节点操作,todolist计划列表实例
    事件冒泡
    jquery事件三 -- load(), ready(), resize()以及bind()事件
    jquery事件二 -- 选项卡,失去焦点
    jqury动画,循环
    jquery事件一 ---鼠标移入移出
    例子2--定时器之无缝滚动
    例子3--元素绝对位置以及置顶菜单
    例子1--手风琴
    jquery之链式调用,层级菜单
  • 原文地址:https://www.cnblogs.com/liAnran/p/10040738.html
Copyright © 2011-2022 走看看