Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
163 views
in Technique[技术] by (71.8m points)

reactjs中的ajax写在componentwillmount中不是更好吗?

描述:

  • 官方建议把ajax写到componentdidmount中,

  • 在render之前,在componentwillmount中执行setState不会重新render

  • 但是如果写在componentwillmount中的setState在render之后执行,比如设置了定时器,setState后,也会造成重新render

  • 写在componentdidmount中的ajax,一定是在第一次render之后再render的


问题:

  • 既然如上所述,那把ajax写在componentwillmount中不是更好吗?

理由:

  1. 如果ajax的执行在render之前得到了值,并setState,那就执行一次render。

  2. 如果在第一次render之后得到了值,那就如同componentdidmount一样再次render就行,这样有可能还省去一些render。

  3. 虽然reactjs的diff算法很快,但两次的render肯定没有一次效率高


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

为什么不推荐在willMount中调用ajax?

componentWillMount执行ajax,对ajax的结果进行setState,即使ajax的返回结果在render之前,也会引起新的render,不会和原来的state进行合并,进行一次render,为什么?
这就需要了解JavaScript的执行机制了,JavaScript是单线程,分为“当前线程”和任务队列。
ajax的执行结果会放到任务队列中,等主线程执行完后采取读取任务队列中的任务进行执行。
虽然setState也是异步的,但是他们不在同一个“任务单元”中,执行上下文已发生改变,所以是不可能被合并的。不仅在willmountajax回调中的setState不会和外面同步调用的setState合并,所以异步的回调都不会。
这样的话,就没必要在willmount中调用ajax,以避免理解不到位,对state的结果预计错误。didMount的执行很明了,不会引起歧义,所以在didMount中最合理了。

在willMount中调用ajax不是错误,只是不推荐。

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...