发表于: 2020-02-12 22:21:47
1 1483
今天完成的事情:
1.推进任务
明天计划的事情:
1.推进任务
遇到的问题和收获:
1.
uploadFile(file) {
const imageUpload = query => {
console.log(query)
//FormData.append(name,value,filename) 添加值和数据
//element ui 在file上面包了一层file,必须用query.file.file
const param = new FormData();
console.log(param);
param.append('file', query.file.file);
// 根据后台需求的数据格式确定headers
return request({
url: '/api/a/u/img/task',
method: 'post',
data: param,
headers: {'Content-Type': 'multipart/form-data'}
})
}
imageUpload({file}).then(res => {
console.log(res);
if (res.data.code !== 0) {
return this.$message.error('上传图片失败');
} else {
if (file) {
this.file = '1'
}
return this.$message.success('上传图片成功');
}
}).catch(res => {
console.log(res);
})
},
上传图片的代码。
<el-upload
class="upload-demo"
name="file"
action="#"
ref="upload"
accept="image/jpeg,image/png,image/jpg"
:auto-upload="false"
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:show-file-list="true"
:limit="1"
:file-list="fileList"
list-type="picture"
:on-exceed="handleExceed"
:before-upload="beforeLoadImage"
:http-request="uploadFile">
<el-button slot="trigger" size="small" type="primary">选取文件</el-button>
<el-button style="margin-left: 10px;" size="small" type="success" @click="submitUpload">上传到服务器
</el-button>
</el-upload>
并设置手动上传
//手动上传到服务器
submitUpload() {
this.$refs.upload.submit();
}
= =
评论