Search code examples
reactjsmaterial-uiuistepperstepper

Keep the pervious step open Vertical Stepper Material-UI


Trying to implement a vertical stepper and keep the previous step open when I move the next one. I tried to use expanded onStepContent but it opens all the steps. I would appreciate some insight on how to fix keep it open. I added the example of the code on code sandbox


Solution

  • You need to use the active property on the Step itself. For your case add something like

    <Step key={label} active={index === activeStep - 1 || index === activeStep}>
    

    to keep the previous step open.