如何将 React 与 PowerBI 自定义视觉对象一起使用

Question

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

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

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

当我尝试传递数据选项时：VisualUpdate选项如下：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"
}
... 

我得到数据正常，消息 2 总是给我没有数据视图。任何建议将不胜感激，我在这方面非常无知并寻求启发：-(

Answer 1

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

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

控制台像现在一样记录道具，您应该会看到它们。