鍍金池/ 問答/HTML/ element upload上傳圖片后臺收不到圖片信息

element upload上傳圖片后臺收不到圖片信息

<el-form-item label="圖片" >
    <el-upload
        class="upload-demo"
        ref="upload"
        drag
        :action="form.uploadUrl"
        :data="form.upLoadData"
        :onError="uploadError"
        :onSuccess="uploadSuccess"
        :before-upload="beforeImgUpload"
        multiple>
        <i class="el-icon-upload"></i>
        <div class="el-upload__text">將文件拖到此處,或<em>選擇文件</em></div>
        <div class="el-upload__tip" slot="tip">請上傳jpg/png文件,且不超過500kb</div>
    </el-upload>
    <img :src="dataUrl" />
</el-form-item>
return {
    form: {
        ac_name: '',
        ac_id:'',
        ac_start_time: '',
        ac_end_time:'',
        uploadUrl:'http://www.youxia.com/yxcard/admin.php?s=/Activity/upload_img',
        upLoadData:{
            img_base64:"",
            type:1
        },
        fileList:[],
        ac_content: ''
    },
    dataUrl:''
}
    
 // 文件上傳前
beforeImgUpload (file) {
    const self = this;  //這個很重要!
    var reader = new FileReader();
    reader.readAsDataURL(file);
    reader.onloadend = function() {
        self.form.upLoadData.img_base64 = this.result;
        console.log(self.form.upLoadData.img_base64);
    };
},
// 上傳成功后的回調(diào)
uploadSuccess (response, file, fileList) {
    console.log('上傳文件', response)
    this.$alert(response.retData.msg);
    console.log(this.form.upLoadData.img_base64);
},

圖片描述

我的beforeImgUpload 已經(jīng)給upLoadData.img_base6賦值了 ,為什么后臺接口收不到數(shù)據(jù)?type=1能收到,回調(diào)成功的upLoadData.img_base64也能打出來,但是后臺顯示的upLoadData.img_base64就是空的。

回答
編輯回答
寫榮

reader.onloadend是異步請求

2018年5月13日 17:22
編輯回答
熟稔

你回調(diào)成功打印的upLoadData.img_base64還是組件內(nèi)部的數(shù)據(jù), 并不是uploadSuccess回調(diào)傳回來的數(shù)據(jù), 最好可以看下 回調(diào)的response和你的請求信息

2018年5月4日 00:49