react表单中参数联动和动态校验

一、联动

方式一

<Form.Item
          noStyle
          shouldUpdate={(prevValues, currentValues) =>
            prevValues.IPOnly !== currentValues.IPOnly
          }
        >
           {({ getFieldValue }) =>
            getFieldValue("IPOnly") ? (
              1
            ) : 2
          }
 </Form.Item>

方式二

 <Form.Item dependencies={['assetType']} noStyle>
          {() => (
            <span>
              {form.getFieldValue('assetType')  ? (
                <Form.Item
                  label='数据库'
                  name='database'
                >
                  <Input placeholder='数据库' />
                </Form.Item>
              ) : null}
            </span>
          )}
  </Form.Item>

二、校验

用hidden属性来实现，相当于vue中的v-show，此方法不会过滤掉参数；用三元运算符则会直接过滤掉参数和校验规则

image.png