How should I unsubscribe from a reactive component when using abbreviations?

Question

In my component, I have the following:

componentWillMount: function () { this.unsubscribe = store.subscribe(function () { this.setState({message: store.getState().authentication.message}); }.bind(this)); }, componentWillUnmount: function () { this.unsubscribe(); }, 

Unsubscribing does not cause the following error:

Warning: setState (...): can only update an installed or mounted component. This usually means that you called setState () on the unmounted component. This is a no-op.

What would I like to know if I should assign unsubscribe to this or is there a better place to assign it?

Answer 1

As Salehen Rahman mentioned above in the comments that I made using react-redux .

Following their documentation, I created two functions: one to display the "global state" in the component details:

 function mapStateToProps(state) { return { users: state.users.items }; } 

and one for matching sent actions with functions transferred to the component as a requisite:

 function mapDispatchToProps(dispatch) { return { lockUser: (id) => dispatch(actions.lockUser(id)), unlockUser: (id) => dispatch(actions.unlockUser(id)), updateUser: (id, user) => dispatch(actions.updateUser(id, user)), addUser: (user) => dispatch(actions.addUser(user)) }; } 

Then everything comes together using the connect method:

 export default connect(mapStateToProps, mapDispatchToProps)(UsersContainer); 

I have a feeling that all this under the hood applies the unsubscribe method to the component, but this greatly simplifies the situation.