[工作中遇到的难点] getDeafultProps的深刻理解

《深入React技术栈》里有提到过,首次挂载组件的时候,getDefaultProps只会加载一次。之后重新挂载就不会在调用了。
第一次看的时候只是粗粗扫掠了一眼,觉得奇怪却没有在意。后来在调试公司代码的时候遇到了一个问题,在首次挂载组件的时候调用了getDefaultProps,并在里面设置了初始值。但是并没有从外部传递props。

看起来没什么问题,结果应该是对的。

但是公司代码里有许多配置文件,在初次挂载的时候加载的是一份默认的配置文件config1,而在第二次挂载的时候,其实我希望加载的是后来加载的非默认配置文件config2。

但是,第二次挂载的时候,调用的this.props.config的值却是config1的值。

React基础语法 state和props初始化方式这篇博文是这样解释的:
1.getDefaultProps
作用于组件类,只调用一次,返回对象用于设置默认的props,对于引用值,会在实例中共享。
2.getInitialState
作用于组件的实例,在实例创建时调用一次,用于初始化每个实例的state,此时可以访问this.props。
对于学过Java的来说,这样显然更好理解一些。
但是,React源码是这样定义的:

ReactClass = {
    createClass: function() {
       ···
      if(Constructor.getDefaultProps) {
           Contructor.defaultProps = Constructor.getDefaultProps();
      }
      ···
    }
}

React生命周期分为四个方法:createClassmountComponentreceiveComponentunmountComponent,分别管理者React的各个生命周期函数。
getDefaultProps()是createClass来控制的,所以在整个声明周期函数中最先执行,而其它生命周期函数是由其它函数控制的,所以会滞后执行。而该方法只会执行一次。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 作为一个合格的开发者,不要只满足于编写了可以运行的代码。而要了解代码背后的工作原理;不要只满足于自己的程序...
    六个周阅读 8,512评论 1 33
  • 目前,react组件有三种写法,分别是es5的createClass写法,es6的class写法,以及statel...
    ZoomFunc阅读 1,849评论 0 1
  • 今日随笔 懒,严重拖延症的我想着日更100字就能完成的任务轻轻松松,今从上午拖到现在晚上10点,昨天更晚,1...
    大日落东阅读 176评论 0 1
  • 项羽,是千古垂名的大英雄,可是在有些人眼里的项羽却是大傻子。他的确战绩累累,但是最后他还是死在了自己的愚蠢之...
    田茁希阅读 643评论 0 0
  • 我就在这,哪儿也不去,不管受了什么伤 — 除非我完全衰弱 — 我还是会一直是像以前一样的拳手。我会看着办,我会做出...
    理想你几岁_639f阅读 108评论 0 0