dependencies主要用于规则校验,它所依赖的字段更新时,该字段将自动触发更新与校验。例如用户名和密码相互校验。
Form.Item的name为字符串时的dependencies
dependencies={['year_average']}
<Row>
<Col span={24}>
<Form.Item
label='月社平工资'
name='month_average'
className='label__required'
dependencies={['year_average']}
rules={[
{
validator: (_, value) =>
validateRule(
value,
'请输入月社平工资',
value,
year_average,
'年社平工资需大于月社平工资'
)
}
]}
>
<InputNumber
controls={false}
placeholder='请输入月社平工资'
addonAfter='元'
style={
{ width: '100%' }}
/>
</Form.Item>
</Col>
<Col span={24}>
<Form.Item
label='年社平工资'
name='year_average'
className='label__required'
rules={[
{
validator: (_, value) => validateRule(value, '请输入年社平工资')
}
]}
>
<InputNumber
controls={false}
placeholder='请输入年社平工资'
addonAfter='元'
style={
{ width: '100%' }}
/>
</Form.Item>
</Col>
</Row>
Form.Item的name为数组时的dependencies
dependencies={[['payment_amount_range', 'company_payment_range_end']]}
<Form.Item label='范围' {...shortLayout}>
<div style={
{ display: 'flex', alignItems: 'center' }}>
<Form.Item
name={['payment_amount_range', 'company_payment_range_start']}
dependencies={[['payment_amount_range', 'company_payment_range_end']]}
rules={[
{
required:
!!payment_amount_range?.company_payment_range_end ||
payment_amount_range?.company_payment_range_end === 0,
message: '请输入下限'
},
{
validator: (_, value) =>
validateMoneyRule(value, payment_amount_range?.company_payment_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={['payment_amount_range', 'company_payment_range_end']}
rules={[
{
required:
!!payment_amount_range?.company_payment_range_start ||
payment_amount_range?.company_payment_range_start === 0,
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.List的dependencies
dependencies={[['users', index, 'name']]}