minimal-flux
minimal-flux copied to clipboard
Store state passed as reference to components
I ran into an issue where methods componentWillReceiveProps(nextProps) on child components have identical props as this.props and nextProps. Turns out it's because the props being set by the parent component is a reference to store state, so when props do get updated, then this.props will reflect the new props before componentWillReceiveProps has been run.
Is this intended behavior? The solution to get it to play with react as expected was the following:
updateState(newState) {
this.setState(_.cloneDeep(newState));
}
componentWillMount() {
this.props.store.addListener('change', this.updateState);
}