Как использовать async-await в функции обратного вызова всплывающей подсказки ChartJS - PullRequest
Новая
       7

Как использовать async-await в функции обратного вызова всплывающей подсказки ChartJS

0 голосов
/ 28 января 2019

Я хочу показать расчетные данные в подсказке ChartJS , которая исходит из обещания, основанного на вызове API.Проблема в том, что я вижу эти требуемые данные в console.log (), но они не появляются во всплывающей подсказке и выдают ошибку, похоже, что обещание не выполнено.

Я ожидаю ссылку hg вместе с другими данными в массиве tooltipData.Остальные простые строки работают хорошо, но когда я пытаюсь отобразить ссылку hg, она отображает [object promise] вместо результата, который я получаю в console.log ().

Похоже, что обратный вызов возвращает массив до разрешения обещания.

Вы можете увидеть фактический результат всплывающей подсказки здесь 

tooltips: {
      callbacks: {
        footer: async (tooltipItems, data) => {
          const tooltipData = [];
          let jobLink = '';
          let hgLink = '';
          let dataset = 'n/a';
          let currentData = 'n/a';
          if (tooltipItems[0].index > 0) {

            // generate hg link
            const currPushId = tooltipDataSet.push_id;
            const prevPushID = series.data[tooltipItems[0].index - 1].push_id;

            const currPushiIdLink = getPushIdLink(currPushId);
            const prevPushiIdLink = getPushIdLink(prevPushID);

            const [currPushData, prevPushData] = await Promise.all([
              fetchPushidData(currPushiIdLink), fetchPushidData(prevPushiIdLink),
            ]);

            const currRevision = currPushData.revision;
            const prevRevision = prevPushData.revision;

            console.log({ currRevision, prevRevision });
// it is working well here and giving the right data

            hgLink = `thislink.com/pushloghtml?fromchange=${prevRevision}&tochange=${currRevision}`;
          }
// I have to display this link in the tooltip 

          hgLink = `hg (${hgLink})`;
          tooltipData.push(indicator, `Δ ${delta} (${deltaPercentage}%)`, jobLink, hgLink); // some other data with hg link
          return tooltipData;
        },
      },
    },
...