Form.Item的name为数组时,设置某个字段的值。Form.List的使用

设置Form.Item的值

Form.Item的name可以为字符串或数组,例如后端接收的数据格式为

{

userName: 'lx',

base_range:

{

company_base_range_start: 1,

company_base_range_end: 2

}},可以使用数组。

 1.设置Form.Item name为数组的值,form.setFieldValue(['base_range','company_base_range_end'], 20)

2.设置Form.Item name为字符串的值,form.setFieldValue('userName', 'lx')

 <Form form={form} onFinish={onFinish}>
            <Form.Item name='userName' label='用户名'>
              <Input />
            </Form.Item>
            <Form.Item label='范围' {...shortLayout} className='label__required'>
                <div style={{ display: 'flex', alignItems: 'center' }}>
                  <Form.Item
                    name={['base_range', 'company_base_range_start']}
                    dependencies={[['base_range', 'company_base_range_end']]}
                    rules={[
                      { required: true, message: '请输入下限' },
                      {
                        validator: (_, value) =>
                          validateMoneyRule(value,                             
                          base_range?.company_base_range_end)
                      }
                    ]}
                    style={{ display: 'inline-block', width: 'calc(50% - 15px)' }}
                  >
                    <InputNumber
                      controls={false}
                      placeholder='下限'
                      addonAfter='元'
                      style={{ width: '100%' }}
                    />
                  </Form.Item>
                  <span style={{ margin: '0 10px 24px' }}>—</span>
                  <Form.Item
                    name={['base_range', 'company_base_range_end']}
                    rules={[
                      { required: true, message: '请输入上限' },
                      {
                        validator: (_, value) => validateMoneyRule(value)
                      }
                    ]}
                    style={{ display: 'inline-block', width: 'calc(50% - 15px)' }}
                  >
                    <InputNumber
                      controls={false}
                      placeholder='上限'
                      addonAfter='元'
                      style={{ width: '100%' }}
                    />
                  </Form.Item>
                </div>
              </Form.Item>
          </Form>

设置Form.List的某个字段的值

form.setFieldValue(['account_info', index, 'id'], undefined)

 <Form.List name='account_info' initialValue={[{}, {}, {}, {}]}>
          {(fields) => (
            <>
              {fields.map(({ key, name }, index) => (
                <div key={key}>
                  <Row>
                    <Col span={1} />
                    <Col span={5}>
                      <Form.Item name={[name, `scene`]} {...noLabelLayout} valuePropName='checked'>
                        <Checkbox
                          disabled={!!subjectScene?.[index]?.scene}
                          onChange={() => {
                            form.setFieldValue(['account_info', index, 'id'], undefined)
                          }}
                        >
                          {sceneList[index]}
                        </Checkbox>
                      </Form.Item>
                    </Col>
                    <Col span={17}>
                      <Form.Item
                        name={[name, 'id']}
                        {...noLabelLayout}
                        rules={[{ required: account_info?.[index]?.scene, message: '请选择账户' }]}
                      >
                        <BankAccountSelect
                          placeholder='请选择'
                          disabled={!!subjectScene?.[index]?.scene || !account_info?.[index]?.scene}
                          subject_id={subjectObject?.key}
                          open_status={1}
                          style={{ width: '100%' }}
                        />
                      </Form.Item>
                    </Col>
                  </Row>
                </div>
              ))}
            </>
          )}
        </Form.List>

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值