MobX Quick Start Guide

Loading a step

The WorkflowStep is where a step comes to life and the only one that can create an instance is the CheckoutWorkflow. After all, it is the owner of the entire workflow. It does this in the loadStep() action method:

export class CheckoutWorkflow {    /* ... */    @action    async loadStep(stepIndex) {        if (this.nextStepPromise) {            this.nextStepPromise.cancel();        }        const StepClass = CheckoutWorkflow.steps[stepIndex].stepClass;        this.step = new StepClass();        this.step.workflow = this;        this.step.load();        this.nextStepPromise = when(            () => this.step.operationState === 'completed',        );        await this.nextStepPromise;        const nextStepIndex = stepIndex + 1;        if (nextStepIndex >= CheckoutWorkflow.steps.length) {            return;        }        this.currentStep = CheckoutWorkflow. ...