2021-12-07 upload上传图片,不请求接口先预览图片

2021-12-07
window.URL.createObjectURL 可以用于在浏览器上预览本地图片或者视频
customRequest 通过覆盖默认的上传行为，可以自定义自己的上传实现

<template>
<div style="margin: 24px">
<a-upload
:file-list="fileList"
:customRequest="customRequest"
list-type="picture"
>
<a-button> <a-icon type="upload" /> upload </a-button>
</a-upload>
</div>
</template>

<script>
export default {
name: "App",
data() {
return {
fileList: [],
};
},
methods: {
customRequest(obj) {
let rep = {
uid: obj.file.uid,
name: obj.file.name,
status: "done",
url: window.URL.createObjectURL(obj.file),
thumbUrl: window.URL.createObjectURL(obj.file),
};
this.fileList.push(rep);
// obj.onProgress({ percent: 100 });
// obj.onSuccess(window.URL.createObjectURL(obj.file), obj.file);
console.log(obj.file, window.URL.createObjectURL(obj.file), "pbj");
},
},
};
</script>

非原创，传送门：https://blog.csdn.net/weixin_43597026/article/details/109626883