react中antd的upload只上传一个文件

如果你使用的是封装的前后台交互方法,表单上传请求头千万不能加!!
accept限定了文件类型后,默认展示文件是筛选后的,但是还可以手动选择,这个时候需要你在表单上传到后台的最后一步在加一个判断。
在这里插入图片描述

<FormItem
            {...formItemLayout}
            label="上传资料"
          >
            {
              getFieldDecorator('file',{ initialValue:this.state.fileList, valuePropName: 'file',})(
                <Upload     {...props}    onRemove={this.onRemove}    beforeUpload={this.beforeUpload}  name="file"  accept=".doc,.docx,.pdf,.txt,.xls,.xlsx,.ppt,.pptx" >
                  <Button>
                    <Icon type="upload" /> 上传资料
                  </Button>
                </Upload>)
            }
          </FormItem>

onRemove是多个文件上传时候的删除操作
beforeUpload方法是只能限制一个文件上传

 onRemove=(file)=>{
    this.setState(state => {
      const index = state.fileList.indexOf(file);
      const newFileList = state.fileList.slice();
      newFileList.splice(index, 1);
      return {
        fileList: newFileList,
      };
    });
  }
  //文件上传之前的操作
  beforeUpload=(file)=>{
    if(this.state.fileList.length===0){
      this.setState(state => ({
        fileList: [...state.fileList, file],
      }));
    }else{
      message.error('只能上传一个文件');
      this.setState(state => ({
        fileList: [...state.fileList],
      }));
    }
    return false;
  }

后台传输千万别加请求头!!千万别加请求头!!!
建议使用formData

export function add(values) {
    const formData = new FormData();
    formData.append('datumClassify', values.datumClassify);
    formData.append('datumPdfname', values.datumPdfname);
    formData.append('datumType', values.datumPid);
    formData.append('file', values.file.file);
  return request(`/emermanager/stand/add`, {
    method: 'POST',
    headers:{
    },
    body:formData,
    state:"ok"
  });
}

谢谢大家的观看,8
在这里插入图片描述

  • 0
    点赞
  • 11
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

boJIke

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值