Функция карты возвращает пустой массив - PullRequest
Новая
       9

Функция карты возвращает пустой массив

0 голосов
/ 17 июня 2019

Я пытался преобразовать BLOB-объект в base64, и я нашел способ обойти это, но в ожидании результата от функции displayBase64String функция map в submitOffre возвращает пустую строку, хотя console.log печатает некоторые данные .

Буду признателен за любое решение вот мой код. 

submitOffre = (saleData) => {
        debugger ;
        var result = base64Service.displayBase64String(saleData);
        console.log("========", result);
        const rs = result.map(value => value.file); // Doesn't work.
        console.log(rs); // rs is empty
    }
class Base64Service {

    blobToBase64 = (blob, callback) => {
        var reader = new FileReader();
        var data = '';
        reader.onload = function () {
            var dataUrl = reader.result;
            var base64 = dataUrl.split(',')[1];
            callback(base64);
        };
        reader.readAsDataURL(blob);
    }

    displayBase64String(formProps) {
        const result = [];
        const outbut = Object.entries(formProps.imageToUpload).map(([key, value]) => {
            this.blobToBase64(value, (data) => {
                result.push({ "file": `data:${value.type};base64,${data}` })
            })
        });
        return result;
    };
} 
export default new Base64Service();

1 Ответ

0 голосов
/ 20 июня 2019

Может помочь что-то подобное:

Я немного изменил ваш код, просто чтобы показать вам базовый шаблон.

Если вы делаете более 1 изображения одновременно, вам нужно будет использовать Promise.all, чтобы отслеживать более 1 обещания одновременно. 

submitOffre = async (saleData) => { // SEE THE async KEYWORD
        debugger ;
        var result = await blobToBase64(saleData); // SEE THE await KEYWORD
        console.log("========", result);
        const rs = result.map(value => value.file); // Doesn't work.
        console.log(rs); // rs is empty
    }

Я буду считать, что вы конвертировали только 1 изображение. 

    blobToBase64 = (blob, callback) => new Promise((resolve,reject) => {
        var reader = new FileReader();
        var data = '';
        reader.onload = function () {
            var dataUrl = reader.result;
            var base64 = dataUrl.split(',')[1];
            callback(base64);
            resolve(base64);  // NOTE THE resolve() FUNCTION TO RETURN SOME VALUE TO THE await
        };
        reader.readAsDataURL(blob);
    });
...