CODEWITHSUNDEEP
reactjsreduximmutable.js
Lucas Franco
Lucas Franco

Reputation: 21

nextProps and this.props have always the same value

componentWillReceiveProps(nextProps) {

    if (nextProps.group.data !== this.props.group.data) {
        console.log(true);
    }
}

the group.data object is comming from

const mapStateToProps = (state, props) => {
    return {

        group: {
            data: state.group.data,
            isFetching: state.group.isFetching,
            error: state.group.error
        }
    }
}

I'm using redux module to collect the data...

I know the the nextPros references to this.props and i know a solution will be to use Immutable.js but I couldn't find a good example of using it and I found many complications integrating it, as I have already so many modules without Immutable.

is there any other solution to compare newProps to this.props or a good example how to use Immutable with Redux.

Thanks, Lucas Franco

Upvotes: 1

Views: 1859

Answers (1)

rodgobbi
rodgobbi

Reputation: 1522

This means that the data object from the store isn't changing, you need to make sure that you are returning a new object in the reducer, and never mutate it. For example: 

// reducer for group
reducer (state = initialState, action) {
...
  // when your code is going to update data return a completely new object
  return {...state,
    data: { ...state.data, ...action.newData} 
    // never something like state.data.someProp = action.someProp
  }
...
}

I'd need to see more of your code to be more sure, mainly the reducer. But if the expression (nextPros.group.data !== this.props.group.data) is resulting in true, it's certain to say that the reference to the data object hasn't changed.

Upvotes: 4

Related Questions