Как получить JSON при нажатии кнопки отправки при использовании компонента ant design Form

#javascript #reactjs #ecmascript-6 #antd

#javascript #reactjs #ecmascript-6 #antd

Вопрос:

Я пытаюсь получить JSON при нажатии кнопки отправки, как показано ниже:

 {
 "qbClientInfo":{
  "FullyQualifiedName": "Test", 
  "PrimaryEmailAddr": {
    "Address": "test@email.com"
  }, 
  "DisplayName": "Test Name", 
  }
}
  

Для этого я создал <Form> как

    <Form
        layout="vertical"
        size="medium" 
        onFinish={onNext}
    >
            <Form.Item
                label="Fully Qualified Name:"
                name="FullyQualifiedName"
                style={{ width: "50%" }}
            >
                <Input />
            </Form.Item>
            <Form.Item
                label="Email Address:"
                name="Address"
                style={{ width: "50%" }}
            >
                <Input />
            </Form.Item>  <Form.Item
                label="Display Name:"
                name="DisplayName"
                style={{ width: "50%" }}
            >
                <Input />
            </Form.Item>
            <Form.Item
              style={{ marginTop: "35px" }}
            >
           <Button
                type="primary"
                htmlType="submit"
                style={{ marginLeft: "15px" }}
                size="large"
              >
                Submit
           </Button>
       </Form.Item>
    <Form>
  

Но это дает этот JSON при нажатии кнопки отправки.

 {
  "FullyQualifiedName": "Test", 
  "Address": "test@email.com"
  "DisplayName": "Test Name", 
}
  

Я попытался <Form.Item> вставить другой <Form.Item> , но это не сработало.

Комментарии:

1. Должен ли PrimaryEmailAddr быть объектом? или это может быть массив

2. Согласно документации API и, как я уже упоминал, это должен быть объект.

Ответ №1:

Измените имя формы.Элемент от name="Address" до name={['PrimaryEmailAddr', 'Address']} , как показано в документах