--- order: 23 title: zh-CN: 动态校验规则 en-US: Dynamic Rules --- ## zh-CN 根据不同情况执行不同的校验规则。 ## en-US Perform different check rules according to different situations. ```tsx import React, { useState, useEffect } from 'react'; import { Form, Input, Button, Checkbox } from 'antd'; const formItemLayout = { labelCol: { span: 4 }, wrapperCol: { span: 8 }, }; const formTailLayout = { labelCol: { span: 4 }, wrapperCol: { span: 8, offset: 4 }, }; const DynamicRule = () => { const [form] = Form.useForm(); const [checkNick, setCheckNick] = useState(false); useEffect(() => { form.validateFields(['nickname']); }, [checkNick]); const onCheckboxChange = (e: { target: { checked: boolean } }) => { setCheckNick(e.target.checked); }; const onCheck = async () => { try { const values = await form.validateFields(); console.log('Success:', values); } catch (errorInfo) { console.log('Failed:', errorInfo); } }; return (
Nickname is required
); }; ReactDOM.render(, mountNode); ```