需求:表单提交的时候,需要先上传图片
直接使用<formItem>加require属性并不生效,antd 4.0以后版本也没有getFieldDecorator方法,所以需要自定义表单验证规则。
rules里面有validator属性作为自定义校验,接收一个promis作为返回值,这里有两个个参数,rule是规则,value是你上图片的值
<FormItem required label="上传产品图片" name="fileList" rules={[{ validator: checkPic }]} > <Upload multiple fileList={fileList} customRequest={customRequest} onRemove={onRemove} > <Button type="link" size="small"> 点击上传 </Button> </Upload> </FormItem>
const checkPic = (rule: any, value: []) => { console.log(rule) return new Promise((resolve, reject) => { if (!value) { reject(new Error('请上传图片')) } else { resolve(value) } }) }
4.0以下版本可以参考这篇文章:https://www.cnblogs.com/ljy-/articles/14047122.html