First of all what is mobx? mobx is a data management library. We use mobx to divide multiple stores according to the specific needs of the business, and to manage the global state and the internal state of the component together. The most important thing is that mobx is relatively easy to get started.
To be precise, mobx is a library, not a framework. For example, if we compare redux to cpu + monitor + mouse + keyboard, etc. Then mobx is equivalent to a complete laptop. What does it mean? The simplest and crudest understanding is that mobx is more convenient to use and faster to use than redux.
And mobx adopts the observer mode, which will automatically respond to the changes of the Store without manually adding judgment code.
In addition, mobx can use multiple stores. What are the advantages? The advantage is that a store only manages one sub-state. We can divide multiple stores according to the function of the component or specific domain entities. All in all, mobx only does one thing, it solves the problem of updating data from state to view.
When we use MobX, we will find that it has three main core concepts: observed state, calculated value and reaction. These three concepts correspond to the three mobx APIs: observable, computed and autorun
simply put
- observable for binding data
- computed is used to bind calculation methods
- The autorun method is used to register the response when the data changes, and the returned function is used to cancel the response.
In addition, why do we advocate to minimize the use of state?
- The problem with setState being asynchronous is that the state we want to use may still be the old state.
- setState will cause unnecessary renders. For example, if I only change the state of the A subcomponent, the render will also trigger the render of the B subcomponent.
All in all, we can better separate and decouple data and controllers and views by separating and managing data state and update operations from components. More conducive to code maintenance. And this decoupling can solve the problem of communication between components very well.