Vue + Element el-upload 动态绑定 action 上传地址,上传地址更新不及时
程序员文章站
2024-01-02 21:17:28
...
<template>
<el-upload
:action="uploadAction"
:before-upload="beforeUpload"
ref="upload" >
<el-button
size="mini"
type="primary"
class="upload-btn" >
上传
</el-button>
</el-upload>
</template>
<script>
export default {
name: 'upload',
data () {
return {
uploadAction: ''
}
},
methods: {
// 上传之前,调接口获取 token 后拼接到上传地址
beforeUpload () {
return new Promise((resolve, reject) => {
this.portService.getFileToken(res => {
// 拼接上传url
this.uploadAction = `/api/upload?token=${res.token}`;
// dom上传地址更新完成后,触发上传
this.$nextTick(() => resolve());
});
});
}
}
}
</script>