时间戳

首页 > 解决方案 > 如何将 React 与 PowerBI 自定义视觉对象结合使用

reactjs - 如何将 React 与 PowerBI 自定义视觉对象结合使用

问题描述

我正在尝试将 Power BI 自定义视觉反应示例推进到可以访问反应组件中父视觉对象的数据视图的阶段。有问题的示例是https://github.com/ignatvilesov/powerbi-visuals-react-sample 这个问题的答案可能不需要 Power BI 自定义视觉的专业知识，React 的知识可能就足够了。

在视觉对象的 Update 方法中，它创建如下调用ReactDOM.render：ReactDOM.render(React.createElement(App), this.element);

这可以工作并创建一个组件，该组件允许 react 组件在视觉对象中显示元素。

当我尝试传递数据选项时： VisualUpdateOptions like this: ReactDOM.render(React.createElement(App,{options} ), this.element);，我发现问题。

我不明白如何使用道具获取选项对象，我尝试了很多方法，这是我在 App.tsx 上的尝试示例

module powerbi.extensibility.visual {
    export class App extends React.Component<any,any> {

        constructor(props: VisualUpdateOptions) {
            super(props);                            
        }     
        public render() {

            var message = "";
            if (this.props == null){
                message = "no data"
            }
            else
            {
                message = "got data"
            }
            var message2 = "";
            if (this.props.dataViews == null)
            {
                message2 = "no dataview"
        }
            else
            {
                message2 = "got dataview"
            }
        ...

我得到数据好的，message2 总是不给我数据视图。任何建议将不胜感激，我在这方面非常无知并寻求启发:-)

标签： reactjspowerbi

解决方案

我认为您应该尝试传递 props 对象以在 visual.ts 中创建元素（在其中创建 react 应用程序的实例）。像这样的东西：

ReactDOM.render(React.createElement(App, {"yourProp": "props"}), this.element);

控制台记录你现在正在做的道具，你应该看到它们。

推荐阅读