本文主要是介绍setstate与mapstatetoprops,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
兄弟组件中一个组件的setstate不会触发另一个兄弟组件更新,只能通过父级的回调来使另一个组件更新,这是项目中经常用的跨足间通信,setstate并不会使mapstatetoprops重新执行。
react-redux中,一个组件的mapstatetoprops会订阅store,只要state中的某个属性例如num发生变化,即有dispatch操作,那么所有组件的mapstatetoprops都会重新执行计算。虽然所有组件的mapstatetoprops都会重新触发,
但是1:mapstatetoprops中映射的是state中的某个属性(return {test:state.testReducerState.num }),不是state这个对象时:
只有那些在mapstatetoprops中映射了state中的num(即return的对象中有num)的组件才会重新触发render(不管这个num有没有在组件中真实使用到,都会重新render,或者说重新触发该组件的更新及相关生命周期),但是如果num是数值类型的话,num值不变的话就不会触发组件的render,只如果num是数组或者对象的话(浅拷贝),即使值不变也会重新触发组件的渲染。通常state是一个对象,如果只是改变state中的其他属性,没有state中的num属性,也是不会触发组件的重新渲染。那些mapstatetoprops中没有映射出state中的num的组件是不会重新触render的,也不会触发mapstatetoprops中映射的是state这个对象(return {teststate:state.testReducerState })的组件的重新渲染。
2:如果某些组件mapstatetoprops中映射的是state这个对象(return {teststate:state.testReducerState }),那么不管action有没有使对象中属性有没有改变,每次都会重新这些组件的渲染(对象浅拷贝造成的),但是如果属性没有改变那么是不会触发mapstatetoprops中return {test:state.testReducerState.num })的组件的重新渲染。
总结:只有state中的某一属性变化时,redux才会触发映射有该属性的所有组件重新渲染,state中某一属性变化只会影响映射了该属性的组件,不会影响该state中其他属性绑定的组件。单一属性的变化会影响其他mapstatetoprops中绑定整个state的组件的渲染。mapstatetoprops return {teststate:state.testReducerState }中绑定整个state的组件中触发action导致某一属性的变化,只会影响mapstatetoprops中return {teststate:state.testReducerState }这种绑定了该属性的组件的渲染。
setstate是react原生的,mapstatetoprops是redux的,两者是有差异的.
只要redux中有一个state发生了变化,那么不管这个mapstatetoprops和该state有没有关联,所有的mapstatetoprops都会重新计算,这个方法有点像vuex中的计算属性,像vuex中的mapstate
这篇关于setstate与mapstatetoprops的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!