在Antd中,可以使用getFieldDecorator
方法来为表单字段添加验证规则和错误提示信息。当字段未填写时,可以通过添加rules
属性中的required
规则来标记为必填字段,并通过validateStatus
和help
属性来设置错误样式和错误提示信息。
下面是一个示例代码:
import React from 'react';
import { Form, Input } from 'antd';
const FormItem = Form.Item;
const MyForm = () => {
const handleSubmit = (e) => {
e.preventDefault();
// 处理表单提交逻辑
};
return (
);
};
export default MyForm;
在上面的代码中,我们给FormItem
组件添加了required
属性来标记为必填字段。然后,我们使用getFieldDecorator
方法为Input
组件添加验证规则和错误提示信息。在validateStatus
属性中,你可以根据表单字段的错误状态来设置样式,例如'error'
表示红色标记;而在help
属性中,你可以根据表单字段的错误信息来设置错误提示信息。
请注意,以上代码示例中使用了函数组件,如果你在使用类组件,将代码稍作修改即可。