Reactjs antd defaultValue return undefined

Question

im trying to make an edit function, the problem come when im trying to get the value from the form, say a user is editing his name, but he does not edit his address, this will make address is undefined even though i already set a defaultValue inside it, this works before in my non antd form, here is my code

form:

<Form onFinish={this.edit}>
            <Typography>Email</Typography>
            <Form.Item
            name="email"
            >
                <Input defaultValue={user.Email} value={user.Email} className="email form-control col-sm-6"/>
            </Form.Item>

            <Typography>Full Name</Typography>
            <Form.Item
            name="name"
            >
                <Input defaultValue={user.FullName} value={user.FullName} className="email form-control col-sm-6"/>
            </Form.Item>
            <Typography>Admin</Typography>
            <Form.Item
            name="admin"
            >
            {
                (user.IsAdministrator)
                ?   <div> 
                  <Select value="yes">Admin
                  <Select.Option value="no">Not Admin</Select.Option>
                  </Select>
                  </div>
                : <div>
                  <Select value="no">Not admin
                  <Select.Option value="yes">Admin</Select.Option>
                  </Select>
                  </div>  
            }
            </Form.Item>
            <Typography>Active Status</Typography>
            <Form.Item
            name="aktif"
            >
            {
                (user.IsActive)
                ? <Toggle className="switch-lg" checked/>
                : <Toggle className="switch-lg"/>
            }
            </Form.Item>
            <Form.Item>
            <Button type="primary" htmlType="submit" className="login col-md-10">Submit</Button>

and here is how i get the value:

edit(values){
        const name = values.name
        const aktif = values.aktif
        const index = this.state.id
        console.log(values)
    }

thanks before, anyhelp will be appreciated

Answer 1

As mentioned in the docs ,

You cannot set value for each form control via value or defaultValue prop, you should set default value with initialValues of Form .

Example below:

<Form
      onFinish={onFinish}
      initialValues={{
        residence: ['zhejiang', 'hangzhou', 'xihu'],
        prefix: '86',
      }}
    >