Is autorun equivalent to componentWillReact?

[mdebbar]

I'm excited about MobX. I was able to reduce the code size significantly by switching from Redux to MobX. Thanks for the great library!

One of the things I usually need in my components is to do some logic whenever a certain prop has changed. Previously, I used to do that logic in componentDidMount and in componentWillReceiveProps. But now I have another source of data: MobX store. Changes happening to mobx data don't trigger componentWillReceiveProps but instead componentWillReact. So now I need to do that logic in componentWillReact as well.

To reduce the number of lifecycle methods I use, I thought of doing:

componentDidMount() {
  autorun(() => this.thatLogic());
}

Is the above equivalent to:

componentDidMount() {
  this.thatLogic();
}
componentWillReact() {
  this.thatLogic();
}

?

My guess is that the autorun solution is even better because it re-triggers the logic based on changes in the data that the logic cares about. As opposed to the latter which re-triggers the logic based on changes in data that the render cares about. Am I correct?

[mweststrate]

Personally I find it quite naturally to react to prop changes. But so far I didn't need to react to other observables (besides rendering of course) in a component. Usually I put that kind of logic in a store / controller. Nonetheless the autorun solution is fine. Don't forget to dispose it on componentWillUnmount!

[mdebbar]

Oh thanks for reminding me to dispose of the autorun. I completely forgot about that.

[sanyamagrawal]

@mweststrate : A quick Question , how do i dispose an autorun/reaction in componentWillUnmount?

componentWillMount() {
reaction(
() => this.props.aggregateStore.filters,
this.fetchData
);
}

How do I dispose this in componentWillUnmount?

[mweststrate]

reaction will return a function, that, if you call it, will dispose the reaction. So just store it somewhere on `this`, and call it on willUnmount Op do 1 mrt. 2018 om 20:23 schreef Sanyam Agrawal <notifications@github.com

…

: @mweststrate <https://github.com/mweststrate> : A quick Question , how do i dispose an autorun/reaction in componentWillUnmount? componentWillMount() { reaction( () => this.props.aggregateStore.filters, this.fetchData ); } How do I dispose this in componentWillUnmount? — You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub <#62 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/ABvGhC_UWxcxIXCKpasb63wCFSrJ1nO1ks5taEqZgaJpZM4IupiQ> .