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"
  });
}

谢谢大家的观看，有问题请留言。或者加我wx16653144918