CODEWITHSUNDEEP
reactjsreact-nativereact-redux
Kevin D.
Kevin D.

Reputation: 1510

componentWillReceiveProps not called despite returning new state object

I have the following mapDispatchToProps

const mapDispatchToProps = dispatch => ({
  surveysRequest: () => dispatch(DashboardActions.surveysRequest()),
  surveysFilter: () => dispatch(DashboardActions.surveysFilter())
});

and in my componentDidMount I'm calling the method

componentDidMount() {
  if (this.animation) {
    this.animation.play();
  }

  this.props.surveysRequest()
}

The surveysSuccess reducer does get called, an even though I am returning a new state, componentWillReceiveProps is never called

const surveysSuccess = createAsyncSuccess(ASYNC_GET, (state, action) => {
    return state.merge({
      surveys: action.data
    })
  }
)

Using the latest ignite react native boilerplate https://github.com/infinitered/ignite

Upvotes: 0

Views: 908

Answers (2)

RIYAJ KHAN
RIYAJ KHAN

Reputation: 15292

You are making shallow copy of your state object and nested values are still being passed by reference.

From docs here

mapStateToProps function will also be re-invoked whenever the connected component receives new props as determined by shallow equality comparisons.

Solution :

const surveysSuccess = createAsyncSuccess(ASYNC_GET, (state, action) => {

    let newState= JSON.parse(JSON.stringify(state)); //add it before using state.
     //rest code
})

Upvotes: 0

John
John

Reputation: 771

https://levelup.gitconnected.com/componentdidmakesense-react-lifecycle-explanation-393dcb19e459

componentWillReceiveProps is only called when the props that the component receives changes. If the state changes, componentWillReceiveProps will not be called. Try using componentWillUpdate or componentShouldUpdate.

Upvotes: 3

Related Questions