React Ant Design: How to Insert Form Between Steps in a Vertical Steps Component?

20 views Asked by At

i have Steps from ant design in my typescript react component. i'm trying to show forms in middle of steps. everytime currentStep count is update that particular form would be open and other forms wouldn't be showed.

<Steps current={plansCurrentStep} className="mb-5 bg-white-primary pl-5 pt-5 pb-60" direction="vertical">
          <Step title="General" description="Name & price catalogue"/>
          <Step title="Handovers & returns" description="Configure handovers and returns"/>
          <Step title="Exchanges" description="Price and limit cars"/>
        </Steps>
        <div style={{display: plansCurrentStep === 0 ? 'block' : 'none'}}>
          <Form
            name="step1Form"
            initialValues={{ remember: true }}
            onFinish={handleSubmit}
          >
            <Form.Item>
              <Button type="primary" htmlType="submit">
                Next
              </Button>
            </Form.Item>
          </Form>
        </div>

this form is after all steps but i want to show it after step one then step 2 and step 2 form... how can i achieve that?thanks

0

There are 0 answers