1.声明式表单验证:
<Form.Item name="username" rules={[ { required: true, message: ‘Please input your Username!‘, }, { max: 20, message: ‘最长20位!‘, }, { min: 5, message: ‘至少5位!!‘, }, { pattern: /^[A-Za-z\d_]+$/, message: ‘自能包含字母数字下划线字符!‘, }, ]} > <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="Username" /> </Form.Item>
2. validator自定义式验证:
<Form.Item name="password" rules={[ { validator: (_, value) =>{ if(value.length >= 6 && value.length<=10) { return Promise.resolve() }else{ return Promise.reject(‘密码长度必须是6~10位‘) } } } ]} > <Input prefix={<LockOutlined className="site-form-item-icon" />} type="password" placeholder="Password" /> </Form.Item>