MobX Quick Start Guide

The React components

In this example, modeling of the observable state is more interesting than the React UI components. On the React side, we have the top level component that sets up the Provider with the instance of CheckoutWorkflow as the store. The Provider comes from the mobx-react package and helps in injecting the store to any React component decorated with inject():

import React from 'react';import ReactDOM from 'react-dom';import { Provider } from 'mobx-react';import { CheckoutWorkflow } from './CheckoutWorkflow';const workflow = new CheckoutWorkflow();export function PageRoutingExample() {    return (        <Provider store={workflow}>            <App />        </Provider>    );}

The App component simply sets up all the Routes using the react-router-dom package. ...