🐛[BUG] ProFormUploadButton通过value传入了默认图片不能被删除

wanghh2000 commented 2 years ago

🐛 bug 描述

ProFormUploadButton通过value传入了默认图片不能被删除

ProFormUploadButton通过value传入了默认图片，默认图片不能被删除，点击删除后，默认图片仍然显示。 ProFormUploadButton定义了max={1} 和listType="picture-card"

📷 复现步骤

1) 定义一个ProFormUploadButton，并提供了默认图片，只支持上传一个图片 2) 通过value传入了初始图片文件, 默认图片可以正常显示 3) 这时点击删除默认图片，控件中显示的默认图片没有被删除(定义在value中被传入的默认图片不能被删除) 4) 查看代码发现上传按钮的隐藏是根据value的值进行判断, value被传给了upload的fiielist和value.

🏞 期望结果

当只定义了ｍａｘ的时候，被删除的默认图片不应该再显示
控件ProFormUploadButton应该支持defaultFileList属性定义，而不是定义在fieldProps中
上传按钮的隐藏与否可以根据defaultFileList的值进行判断

💻 复现代码

<ProFormUploadButton label="正面照片" width="sm" max={1} name="ffile1x" listType="picture-card" rules={[{ required: false, message: '请上传正面照片' }]} action="/api/common/uploadimage" onChange={(e) => { updateFormImage(e, 'ffile1', 0, 3); }} value={getImage('ffile1')} />

© 版本信息

ProComponents 版本: "@ant-design/pro-form": "^1.49.0"
umi 版本： "umi": "^3.5.0",
浏览器环境： Firefox & Chrome
开发环境 [e.g. mac OS] Windows

🚑 其他信息

chenshuai2144 commented 2 years ago

max 只是用来控制按钮显示的。不能真的控制。你要控制可以用 getValueProps 来自动配置

a1392136 commented 2 weeks ago

可以检查是否结合 react useState 使用，我就是直接设置 value 的值没有使用 useState 导致删除按钮失效参考代码

const [fileList, setFileList] = useState<UploadFile[]>([]);
<ProFormUploadButton 
    value={fileList}
    onChange={({ fileList: newFileList }) => {
      setFileList(newFileList);
    }} 
  />

ant-design / pro-components