1

我正在将道具传递给createprofile组件，并想从道具设置蚂蚁设计表单的初始值。在道具中，我有name和email。道具有值，但是当我将它们传递给初始值时，它什么也没显示。请告诉我我在哪里犯了错误。当我console.log()有任何道具时，它会显示道具值，但 ant design form 并没有在表单中设置它。

const CreatePatientForm = ({name,email,_id,createProfile}) => {
    const [form] = Form.useForm();
        usePageData(pageData)
        const onFinish = (values) => {
            console.log('Success:', values);
            const g={cnic:values.cnic,gender:values.gender, age:values.age }
            console.log('Success:', g);
            createProfile(_id,g)
         form.resetFields()
               };
             
               const onFinishFailed = (errorInfo) => {
                 console.log('Failed:', errorInfo);
               }; 
                            
               console.log(typeof(name));
              
                         
    return (
        <div>
              <Form
     form={form}
     
           name="basic"
           labelCol={{
             span: 4,
           }}
           wrapperCol={{
             span: 16,
           }}
           initialValues={{ name:{name},email:{email},cnic:"", gender:"", age:""}}
           onFinish={onFinish}
           
           onFinishFailed={onFinishFailed}>
               
            <Form.Item label="Gender"  name="gender" wrapperCol={{ offset: 0, span: 10 }}  rules={[{ required: true, message: 'Gender is required!' }]}>
          <Select placeholder='Please select gender'>
            {/* <Select.Option value="#" disabled={true}></Select.Option> */}
            <Select.Option value="male">male</Select.Option>
            <Select.Option value="female">female</Select.Option>
            <Select.Option value="other">other</Select.Option>
          </Select>
        </Form.Item> 
      <Form.Item
               wrapperCol={{ offset: 0, span: 10 }}
        label="Name"
        name='name'
        // rules={[{ required: true, message: 'Name is required!' }]}
      >
       
        {/* <span>{name && name}</span> */}
        <Input disabled value={name}   />
      {/* </Form.Item> */}
      
      </Form.Item>
      <Form.Item
               wrapperCol={{ offset: 0, span: 10 }}
        label="Email"
        name="email"
        // rules={[{ required: true,type:'email', message: 'Email is required!' }]}
      >
        <span>{email && email}</span>
        {/* <Input disabled value={email} /> */}
      </Form.Item>
      <Form.Item
               wrapperCol={{ offset: 0, span: 10 }}
        label="Age"
        name="age"
        rules={[{ required: true, message: 'Age is required!' }]}
      >
        <Input maxLength={13} placeholder='Enter Age' value='age' />
      </Form.Item>
      <Form.Item
               wrapperCol={{ offset: 0, span: 10 }}
        label="CNIC"
        name="cnic"
        rules={[{ required: true, message: 'CNIC is required!' }]}
      >
        <Input maxLength={13} placeholder='Enter CNIC' value='cnic' />
      </Form.Item>
      <Form.Item wrapperCol={{ offset: 11, span: 10 }}>
        <Button type="primary" htmlType="submit">
         Complete Profile
        </Button>
      </Form.Item>
              </Form>
        </div>
    )
}

export default CreatePatientForm
4

0 回答 0