element ui 上传文件组件

 
           选择导入文件
 
//自定义请求
 
   


确 定
重 置
//data为参数(post方式)
 new Vue({
        el: "#DataBase",
        data: {
            uploadData:{
                id:""
            },  
        },
       methods: {
           //上传
            success(response,file,files){
                if(response.statusCode!=1){
                    this.fileList = []
                }
                this.init()
                this.$alert(response.message)
            },
            handleRemove(file,fileList){
                console.log(file, fileList);
            },
            handlePreview(file){
                console.log(file);
            },
            handleExceed(files, fileList) {
                this.$message.warning(`当前限制选择 1 个文件`);
            },
            beforeRemove(file, fileList) {
                return this.$confirm(`确定移除 ${ file.name }?`);
            },
            handleSelectionChange(val) {
                this.multipleSelection = val;
                console.log(val)
            },
            handleSizeChange(val) {
                this.page_size = val
                this.init()
            },  
          //自定义上传
         beforeUpload (file) {
          console.log(file)
          let fd = new FormData()
          fd.append('file', file)
          fd.append('groupId', this.groupId)
          // console.log(fd)
           axios.post(url, fd, {
          console.log(res)
         })
       return true
       },
      newSubmitForm () {
          this.$refs.newupload.submit()
      },
    
    })

自定义请求,action写个任意的url,会出现404错误,然后设置auto-upload="false" ,这样就可以在方法中自定义请求方式

你可能感兴趣的:(element ui 上传文件组件)