时间戳

首页 > 解决方案 > 在 React JS 中嵌入 Power BI 报表以获取报表实例

javascript - 在 React JS 中嵌入 Power BI 报表以获取报表实例

问题描述

我正在尝试在 React JS 中嵌入 Power BI 报表，我想嵌入报表并让报表实例进一步使用它。我正在使用 Power BI react 扩展来响应嵌入报告，但我不断收到无法读取未定义的属性“嵌入”的错误。

索引.js

import { powerbi, models, embed } from "powerbi-client";
import React, { useState, useEffect } from "react";
import ReactDOM from "react-dom";

function ReportBI() {
  let token ="abcExample";
  let embedUrlBi = "https://app.powerbi.com/reportEmbed";
  let reportId = "ReportID";
  
  const embedConfig = {
    type: "report",
    id: reportId,
    embedUrl: embedUrlBi,
    accessToken: token,
    tokenType: models.TokenType.Embed
  };

  function test() {
    var embedContainer = document.getElementById("container");
    var report = powerbi.embed(embedContainer, embedConfig);
    console.log(report);
  }
  useEffect(() => {
    test();
  });
   
  return (
    <>
      <div id="container"></div>
      
    </>
  );
}

const element = <ReportBI />;

ReactDOM.render(element, document.getElementById("root"));

索引.HTML

<div id="root">
      <div id="container"></div>
    </div>

我试图在嵌入报告后获取它的实例以用它做其他事情。我可以这样做吗？

标签： javascriptreactjspowerbipowerbi-embedded

解决方案

您可以尝试使用新的powerbi-client-react库将 PowerBI 实体嵌入到 React 应用程序中

“ getEmbeddedComponent ”属性返回嵌入式 PowerBI 报表的实例

推荐阅读