Блог

Я использую библиотеку на основе событий (powerbi-client-react)

Сначала я должен получить компонент getEmbeddedComponent и установить его в report переменной, а затем использовать report.getFilters() (метод на основе обещаний) для получения некоторых значений.

Я попытался получить значения внутри getEmbeddedComponent

 getEmbeddedComponent={function (embeddedReport) {
  console.log("enter here", embeddedReport) // well entering here
  embeddedReport.getPages().then(function (filters) {
    console.log("get filters", filters);
  }).catch(function (errors) {
    console.log("error", errors);
  });
}}
  

Но я никогда не попадаю внутрь обратного вызова.

Итак, я попытался использовать useState() и запускать getFilters внутреннюю eventHandlers часть, но значения всегда { test: "init" } (начальные значения

 function App(props) {
  const [embedToken, setEmbedToken] = useState(props.token);
  const [report, setReport] = useState({ test: "init" });

  useEffect(() => {
    if (props.token === undefined) {
      props.requestToken();
    }
    setEmbedToken(props.token);
  }, [props.token]);
  return (
    <div className="App">
      <QueuesFilter />
      <PowerBIEmbed
        embedConfig={{
          type: "report", // Supported types: report, dashboard, tile, visual and qna
          id: props.reportInfos?.id,
          embedUrl: props.reportInfos?.embedUrl,
          accessToken: props.token,
          tokenType: models.TokenType.Aad,
          permissions: models.Permissions.All,
          settings: {
            panes: {
              filters: {
                expanded: true,
                visible: false,
              },
            },
            background: models.BackgroundType.Transparent,
          },
        }}
        eventHandlers={
          new Map([
            [
              "loaded",
              function (event) {
                console.log("Reporttest loaded", report);
              },
            ],
            [
              "rendered",
              function () {
                console.log("Reporttest rendered", report);
              },
            ],
            [
              "visualRendered",
              function () {
                console.log("Reporttest visualRendered", report);
              },
            ],
            [
              "error",
              function (event) {
                console.log(event.detail);
              },
            ],
          ])
        }
        cssClassName={"report-style-class"}
        getEmbeddedComponent={function (embeddedReport) {
          console.log("Reporttest getEmbeddedComponent", report);
          setReport(embeddedReport);
        }}
      />
      {/* <div className="report-style-class" ></div> */}
    </div>
  );
}
  

Я несколько раз перезагружал приложение и всегда получал журналы консоли в том же порядке

Я вижу, вы хотите получить доступ к обновленному объекту отчета внутри ваших обработчиков событий.
Рекомендуемый способ — принять обновленный отчет в качестве второго параметра обработчика событий
См. Документы> Использование> Установить обработчики событий

 eventHandlers={
  new Map([
    [
      "loaded",
      function (event, report) {
        // 2nd param is the updated report object
        console.log("Reporttest loaded", report);
      },
    ],
    [
      "rendered",
      function (event, report) {
        console.log("Reporttest rendered", report);
      },
    ],
  ]
}
  

Вы получаете старое значение состояния отчета, потому что при обновлении реквизитов карта обработчика событий обновляется в компоненте PowerBIEmbed только в том случае, если обработчик события / события изменен по сравнению с предыдущими реквизитами.
Поэтому был вызван старый обработчик событий, который ссылался на старое состояние переменной отчета из-за замыканий в JS