Получить значение ожидающего обещания - PullRequest
0 голосов
/ 12 мая 2018

Я работаю над созданием PDF с помощью pdfmake и получаю изображения многих диаграмм с помощью html2canvas.
Как я могу получить значение Обещания возврата html2canvas?

CODE

    var img = { token: html2canvas(document.getElementById("chartContainer")).then(canvas => {
    return canvas.toDataURL("image/jpeg,1.0")
    }).then(canvas =>{return canvas})}

    console.log (img.token); // Promise { <state>: "pending" }
    alert(img.token); // Object Promise

Я хочу использовать изображения вне функции. Спасибо за вашу помощь!

Ответы [ 2 ]

0 голосов
/ 12 мая 2018

Если обещания и .then сбивают с толку, и вы как-то пытаетесь получить значения из будущего, чтобы использовать их здесь и сейчас, рассмотрите async/await, который позволяет вам писать асинхронный код способом, который вроде выглядит синхронно:

const canvas = await html2canvas(document.getElementById("chartContainer"));
const token = canvas.toDataURL("image/jpeg,1.0");
const img = { token };

console.log (img.token);
alert(img.token);

Внутренне вышеприведенный код передается или интерпретируется таким образом, чтобы ждать выполнения обещания html2canvas, используя эквивалент .then. Другими словами, это выглядит так:

html2canvas(document.getElementById("chartContainer"))
  .then(canvas => {
    const token = canvas.toDataURL("image/jpeg,1.0");
    const img = { token };

    console.log (img.token);
    alert(img.token);
  });

Или, если по какой-то причине вы не хотите использовать async/await, вы можете просто написать это так, чтобы начать с

PS. Предполагая, что приведенный выше код находится внутри функции, он должен быть async function.

0 голосов
/ 12 мая 2018

Вам нужно дождаться выполнения обещания. Когда обещание завершается, вызывается функция, переданная вами в .then(/*...*/).

Вам также не нужно использовать дополнительный .then после toDataURL, потому что toDataURL работает синхронно (оно не возвращает обещание). Вам нужно использовать .then только для функций, которые возвращают обещание.

Так что вместо этого вы можете переписать это так:

html2canvas(document.getElementById("chartContainer"))
    .then(canvas => {
        // This code will run once the promise has completed
        var img = { token: canvas.toDataURL("image/jpeg,1.0") };
        console.log(img.token);
        alert(img.token);
    });
...