react native component receive props does not load when my screen loaded for second time

Question

I'm using React Native Material Bottom Navigation Tabs are working Fine from one tab to another Tab., For the First time componentwillreceiveprops loads data and alert appears,

But when the tabs are tapped from one to other the alert doent appears untill the tab is pressed for twice.

my code is below :

 <View style={{flex: 0.9}}>
              {this.state.activeTab === 0 ? <Tab1/> :this.state.activeTab === 1 ? <Tab2/> : this.state.activeTab === 2 ? ...... }
          </View>
          <View style={{flex: 0.1,justifyContent:"center"}}>
            <BottomNavigation
                  activeTab={this.state.activeTab}                
                  labelColor={myColors.spaceGrey}
                  rippleColor="lightgrey"
                  style={styles.bottomNavigation}
                  onTabChange={this.handleTabChange}>
                  <Tab
                      barBackgroundColor={myColors.white}
                      label="Tab1"
                      icon={<Icon size={window.width/17.1} color={myColors.spaceGrey} name="film" />}
                  />
                  <Tab
                      barBackgroundColor={myColors.white}
                      label="Tab2"
                      icon={<Icon size={window.width/17.1} color={myColors.spaceGrey} name="buysellads" />}
                  />
                  ...........
</BottomNavigation>

And my Tab1 component with componentWillReceiveProps is Here:

componentWillReceiveProps(nextProps){
    const propsData = nextProps 
    const propsDataTwo = propsData

    ListOfObjects = propsDataTwo.data.listofobjects
    if(ListOfObjects != undefined){
      if (ListOfObjects != [] && ListOfObjects != 0) {
        this.setState({
         emptyText: false,
         loading: false
        },()=>{alert("Tab1")})
       } else {
         this.setState({
           emptyText: true,
           loading: false
         })
       }
    }
  }

component will receive props similar to the Tab2

Can Briefly understand if the Zif file is viewed below:- Find here

Please let me know what mistake i have done here

score 0 · Answer 1 · answered Oct 16 '18 at 10:50

Maybe this helps https://reactjs.org/blog/2018/06/07/you-probably-dont-need-derived-state.html

What it actually says is: Do not rely on componentwillreceiveprops, the method might get called as many times as we predict, but it might not update props as many times it gets called. Because if props received dont change, it gets called but dont actually do anything.

Since u dont ask solution, i'll just stop there lemme know if some corrections needed or something still unclear

react native component receive props does not load when my screen loaded for second time

1 Answers1