React upload progress bar problem

   canUpload: true, // whether to upload, the initial value can not be uploaded, so disabled to true
        The name '', // upload the file: filename
        loading: false, // click Upload occur when loading icon
        fileList: [], // list of files uploaded
        isNumber: true, // determine whether the number is a number,
 
    // js code for a new upload file
    submitUpload(){
        if(!this.state.isNumber){
            message.error ( "Please enter the correct number format");
            return
        }
        this.setState({ loading: true });
        var here = this;
        var file=document.getElementById('pic').files[0];
        // var decodeStr = URLDecoder.decode(this.state.datasetName);
        // decodeStr = this.state.datasetName;
        $.ajax({ 
            // url: this.uploadUrl+"?name=" + URLDecoder.decode(this.state.datasetName), 
            url: this.uploadUrl+"?name=" + this.state.datasetName,
            // url: ajax.shangchuanshu (decodeStr),
            type: "post",
            data: file,     
            processData: false, 
            contentType: false, 
            success: function(res) { 
                if(res){ 

                    if(res.status == "OK"){
                        here.uploadSuccess (); // upload operation after a successful
                        // delay of three seconds to refresh the list
                        setTimeout(function(){
                            
                            here.getTrainDataSetList();

                            message.success ( "uploaded successfully!");
                            var fileList = here.state.fileList;
                            fileList.push(here.state.filename);
                            here.setState({loading: false,fileList:fileList});
                        },2000);
                    }else{
                        message.error(res.message);
                        here.setState({loading: false});
                    }
                    
                    
                    
                } 
            }, 
            error:function(err){ 
                notification['error']({
                    message: here.state.filename + 'file upload failed'
                    description: ''
                });
                here.setState({loading: false});
            }
        });
    }
    // value determined file selection box
    fileInput(e){
        var file=document.getElementById('pic').files[0];
        var dataSetName=file.name.split(".zip")[0];
        var filename = file.name;
        if(filename===''){
            . Document.getElementById ( "fileTips") innerHTML = "Please select a file to upload";
        }else{
            document.getElementById("fileTips").innerHTML="";
            var fileTypeArr = filename.split(".");
            var fileType = fileTypeArr[fileTypeArr.length-1];
        }
        if(fileType!='zip'){
            . Document.getElementById ( "fileTips") innerHTML = "You can only upload the zip file";
            this.setState ({canUpload: true, choiceFile: 'Please select a file to upload', datasetName: ''}); // When the selected file is not legitimate uploaded, the upload button is disabled to true
        }else{
            this.getDatasetsName(file.name);
            if(!this.state.isNumber){
                message.error ( "Please enter the correct number format");
                this.setState({
                    canUpload: true,
                    datasetName:'',
                    choiceFile: 'Please select a file to upload'
                }); // When you choose to upload files legal, the disabled Upload button to false
            }else{
                this.setState({
                    canUpload: false,
                    choiceFile:filename,
                    datasetName:dataSetName,
                    filename: filename
                });
            }
        }   
    }
 
 
 
    dataSetNumBlur(){
        var regTest = /.*[^1-9]+.*$/;// whether there are other characters in addition to numbers, is true, not a number
        var = ISNUM regTest.test (this.state.datasetNum);
        if(isnum){
            this.setState ({isNumber: false}); // can not upload button clicks
            document.getElementById ( "dataSetNum") innerHTML = "Please enter a number.";
        }else{
            this.setState({isNumber: true});
            document.getElementById("dataSetNum").innerHTML="";
        }
    }
 

Guess you like

Origin www.cnblogs.com/zhanglanzuopin/p/12604362.html