1、復現：用antd的Form表單驗證上傳圖片必填項時出現問題：復現過程，先提交，提示圖片需要上傳，上傳成功后，依舊提示：圖片未上傳

2、表單驗證原理：先理解一下antd的Form表單驗證的表層原理，每個表單getFieldDecorator配置項都有個名字，比如就叫goodsSkuImg，這個goodsSkuImg對應this.props.form.goodsSkuImg如果為空則驗證不通過。

3、結論：Form提示的根本原因是this.props.form.goodsSkuImg值為空

4、解決方案：

在上傳時調用如下

this.props.form.setFieldsValue({goodsSkuImg: [{uid: publicUrl,name: file.name,status: 'done',url: publicUrl,}] });

此時this.props.form.goodsSkuImg就不為空驗證通過

5、注意：在移出圖片的方法中也需要調用

this.props.form.setFieldsValue({goodsSkuImg: undefined });

使得this.props.form.goodsSkuImg為空，表單驗證不通過

轉載于:https://www.cnblogs.com/piaobodewu/p/10498896.html

總結

以上是生活随笔為你收集整理的ant-pro使用Form表单验证上传图片出现的问题的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。