vue+elementUI的图片即时上传

后台管理项目,用到的是vue+elementUI的方式,upload板块,api个人感觉还是不够详尽,现在,来说一下关于立即上传的问题.主要用到的是http-request的覆盖原有上传方式,(因为我需要传token给后台),所以action的值可以写为空串.页面代码:<el-upload class=“upload-demo” name=“usersFile” action="" :on-preview=“handlePreview” :http-request=“uploadFile” :on-remove=“handleRemove” :auto-upload=“true” :on-exceed=“handleExceed” :file-list=“fileList”> <el-button size=“mini” type=“primary”>批量上传</el-button></el-upload>可以看到,http-request对应的方法uploadFile是重点:uploadFile(file){ let formDatas = new FormData(); formDatas.append(‘usersFile’, file.file); formDatas.append(’tokenId’,this.$store.state.user.tokenId); this.$post(’/yourUrl’,formDatas).then(res =>{ if(res.code == 0){ this.$message({ message: res.msg, type: ‘success’ }); }else{ this.$message({ message: res.msg?res.msg:‘操作失败’, type: ’error’ }); } }) },说明:其中字段usersFile就是后台要的key,值就是你选择的文件 ,这样就实现了立即上传.