Ant Design Upload组件

文档:https://3x.ant.design/components/upload-cn/

取消图片删除按钮

<Upload
  showUploadList={{showRemoveIcon:false}}  //加上这句代码
  onChange={this.uploadStateChange}
  beforeUpload={this.beforeUpload}
  listType="picture-card"
  fileList={this.state.fileList}
  onRemove={this.handleRemove}
  onPreview={this.handlePreview}
  onSuccess={this.complate}
>

显示文件下载按钮

const props = {
  action: action,
  headers: { Authorization: token },
  data: { merchantId: merchant_id, fileType: type },
  // customRequest: this.customRequest,
  onChange: this.handleChange,
  // beforeUpload: this.beforeUpload,
  listType: 'picture',
  multiple: true,
  onRemove: this.onRemove,
  onDownload: this.onDownload,
  className: 'upload-list-inline',
  showUploadList: { showDownloadIcon: true }
  // defaultFileList: [...fileList],
};
{list.map((data, i) => (
  <div key={i} className={`${aStyle} ${bStyle} `}>
    <Upload
      key={i}
      {...props}
      defaultFileList={this.getDefaultUploadFile(type, data.doc_id)}
      // fileList={this.getDefaultUploadFile(type, data.doc_id)}
      // beforeUpload={file => this.beforeUpload(file, data.doc_id)}
      handleChange={file => this.handleChange(file, data.doc_id)}
    />
  </div>
))}

版权声明:
作者:Joe.Ye
链接:https://www.appblog.cn/index.php/2023/03/12/ant-design-upload-component/
来源:APP全栈技术分享
文章版权归作者所有,未经允许请勿转载。

THE END
分享
二维码
打赏
海报
Ant Design Upload组件
文档:https://3x.ant.design/components/upload-cn/ 取消图片删除按钮 <Upload showUploadList={{showRemoveIcon:false}} //加上这句代码 onChange={……
<<上一篇
下一篇>>
文章目录
关闭
目 录