Vue建站：FileReader的異步問題

因爲想統一通過base64傳輸gif文件，所以在不能通過canvas重繪修正並得到base64編碼的情況下，我選擇使用FileReader()來獲取gif文件的base64編碼，但是有個問題困擾了我很久:

    readasbase64(file){
    //     return new Promise(function(resolve, reject) {    
    //     let reader=new FileReader();
    //     let that = this;
    //     reader.readAsDataURL(file);
    //     reader.onload = function() {
    //         resolve(this.result)
    //     }
    // }) 
    let reader=new FileReader();
        let that = this;
        reader.readAsDataURL(file);
        reader.onload = function() {
            that.base64 = this.result
        }
    },

這裏我通過that.base獲取reader的結果，企圖獲得文件的base64編碼（我在post中調用）可是發現每次在ajax提交（也是在post函數中）的時候，提交的參數中都沒有該文件的base64值。
後面我又通過promise（如註釋所示），希望獲取到其值以後再異步提交請求，但是還是因爲異步的關係沒有作用…

最後我將調用readasbase64()函數放在了用戶選擇圖片還沒有提交之前，也就是另外的函數中（不是post函數）調用，此時是可以拿到值的。也實現了傳gif的功能，但是gif太大…自己的小網站帶寬太小，導致上傳時間較長（3s左右的卡頓），因此取消了這個功能…

哎，以此紀念爲了搞這個功能讓我逝去的3個小時。