Actions

An action is any piece of code that changes the state. User events, backend data pushes, scheduled events, etc. An action is like a user that enters a new value in a spreadsheet cell.

Actions can be defined explicitly in MobX to help you structure code more clearly. If MobX is used in strict mode, MobX will enforce that no state can be modified outside actions.

Unlike many flux frameworks, MobX is unopinionated about how user events should be handled.

• This can be done in a Flux-like manner.
• Or by processing events using RxJS.
• Or by simply handling events in the most straightforward way possible, as demonstrated in the above onClick handler.

In the end, it all boils down to: Somehow the state should be updated.

After updating the state MobX will take care of the rest in an efficient, glitch-free manner. So simple statements, like below, are enough to automatically update the user interface.

There is no technical need for firing events, calling a dispatcher or what more. A React component in the end is nothing more than a fancy representation of your state. A derivation that will be managed by MobX.

store.todos.push(
    new Todo("Get Coffee"),
    new Todo("Write simpler code")
);
store.todos[0].finished = true;

Nonetheless, MobX has an optional built-in concept of actions. Use them to your advantage; they will help you structure your code better and make wise decisions about when and where state should be modified.