添加链接
link之家
链接快照平台
  • 输入网页链接,自动生成快照
  • 标签化管理网页链接

在这里插入图片描述
如果我们不想显示这两个图标,应该如何操作呢?官方文档上有如下介绍:
通过设置Upload组件的showUploadList属性下的showPreviewIcon, showRemoveIcon, showDownloadIcon,即可控制预览图标、删除图标、下载图标的展示和隐藏
在这里插入图片描述
比如,我要隐藏Upload的预览图标
详细代码如下:

<Upload
  action={action}
  accept={accept}
  listType="picture-card"
  maxCount={maxCount}
  multiple
  headers={{'content-type': 'multipart/form-data'}}
  beforeUpload={this.beforeUpload}
  fileList={fileList}
  onRemove={this.onRemove}
  showUploadList={{showPreviewIcon: false}}
</Upload>

通过设置showUploadList={{showPreviewIcon: false}},即可实现预览图标的隐藏,效果如下
在这里插入图片描述

文章参考:https://www.cnblogs.com/zpsblog/p/13809406.html

antd如何隐藏Upload组件的删除和预览图标如下所示,当Upload组件文件上传成功后,默认会出现预览和删除的图标如果我们不想显示这两个图标,应该如何操作呢?官方文档上有如下介绍:通过设置Upload组件的showUploadList属性下的showPreviewIcon, showRemoveIcon, showDownloadIcon,即可控制预览图标、删除图标、下载图标的展示和隐藏比如,我要隐藏Upload的预览图标详细代码如下:&lt;Upload action={actio action="http://xxxxx/File"//上传文件接口 :multiple="true" :showUploadList="{showRemoveIcon:false}" //不显示删除按钮
记住:setFieldsValue的字段要对应得上 解决antd的Form组件setFieldsValue的警告 使用antd的Form组件setFieldsValue可能会出现You cannot set a form field before rendering a field associated with the value.警告,字面意义去看是说在 render之前设置了表单值的问题。 在使用setFieldsValue给表单Form的某一个filed赋值时,可能掺杂了非表单控件中的字段,Form表单在赋值和渲染时发现有些字段无法渲染在现有的字段(因为不存在),所以就会报出这
import React, { PureComponent } from 'react' import { Card, Icon, List, Avatar, message, Upload } from 'antd'; import { connect } from 'dva'; import PageHeaderWrapper from '@/components/PageHeaderWrapper'; import styles from './style.less'; import { getAcc
今天遇到测试提起的一个项目bug。 使用antd里面的 upload 组件上传图片,本地测试使用没有问题。 当项目上传到服务器,测试 接口报405,打开控制台中的network,访问了一个没有调用的接口,nginx 报405。 网上查询资料,是upload组件上传图片默认调用了action 路径,如果未设置的话,就以当前网页的url为路径进行访问。方法为post请求进行访问静态资源。 使用customRequest属性来阻止默认上传行为 <Upload name="avatar" list.
图片上传自定义方法的使用,参数的上传 其中customRequest 作为自定义上传的方法与后端进行交互并可以传递额外的参数 beforeUpload 方法可以对上传的图片类型和大小做一下相对简单的前端校验 <Upload name="uploadFile" listType="picture-card"
<el-form-item label="一号位图:" prop="pgUrl1"> <el-upload action=""<!--指定上传地址,我要自己上传,这样可以防止服务器上产生垃圾数据--> :http-request="gprequestUpload1"<!--覆盖后的上传方法--> list-type="picture-card"<!--...
React Antd Upload 组件默认支持拖拽上传,如果需要禁止拖拽上传,可以设置 Upload 组件的 `drag` 属性为 `false`,如下所示: ```jsx <Upload // ...其他属性 drag={false} {/* ... */} </Upload> 设置 `drag={false}` 后,用户将无法通过拖拽文件进行上传,只能通过点击上传按钮或者选择文件进行上传。
控制台出现报错DevTools failed to load source map: Could not load content for chrome-extension://的原因及解决方案 21283