Open nickcanarelli opened 4 years ago
I'm having difficulties displaying the current step count with the total number of steps.
It says Step 1 of 1 for each form page when there are 3 total steps so far. It should say Step 1 of 3, Step 2 of 3, etc... Any help is appreciated.
function FormWrapper({ children, isLastStep, status, goToPreviousStep, canGoBack, actionLabel }) { const [stepNumber, setStepNumber] = useState(0); const steps = Children.toArray(children); const step = steps[stepNumber]; const totalSteps = steps.length; return ( <> <p> Step {stepNumber + 1} of {totalSteps} </p> {status && ( <div> {status.message} <hr /> </div> )} {children} <Row> <Col lg={{ span: 9, offset: 3 }} className='onboard__actions'> <button type='button' onClick={goToPreviousStep} disabled={!canGoBack} className='onboard_btn onboard_btn-secondary' > Previous </button> <button type='submit' className='onboard_btn onboard_btn-primary'> {actionLabel || (isLastStep ? 'Submit' : 'Next step')} </button> </Col> </Row> </> ); }
I'm having difficulties displaying the current step count with the total number of steps.
It says Step 1 of 1 for each form page when there are 3 total steps so far. It should say Step 1 of 3, Step 2 of 3, etc... Any help is appreciated.