在模型驱动的 PowerApps 中使用过滤后的数据反应渲染新视图答案

【问题标题】：React rendering new view with filtered Data in Model Driven PowerApps在模型驱动的 PowerApps 中使用过滤后的数据反应渲染新视图
【发布时间】：2020-03-02 17:40:48
【问题描述】：

目前我正在模型驱动的应用程序中实现自定义列表。我注意到在过滤数据时调用了 init 方法以及 updateView 方法，此外，updateView 方法被调用了 3 次。但是，新视图并未呈现。

我的猜测是我的组件没有正确排序和处理异步承诺，因此最后的 init 方法会将所有内容重置为原始数据或用原始数据覆盖它。

这样做的正确方法是什么？

最初渲染组件（这里我指的是init 或updateView 方法中的渲染代码）？
如果数据被刷新，如何处理异步调用才能再次渲染视图？

目前代码如下：

     public init(context: ComponentFramework.Context<IInputs>, notifyOutputChanged: () => void, state: ComponentFramework.Dictionary, container: HTMLDivElement) {
    this._context = context;
    //load the global context with the app properties.
    this._globalContext = Xrm.Utility.getGlobalContext();
    this._globalContext.getCurrentAppProperties().then((appProperties:any) =>{
      this._currentAppProperties = appProperties;
      this._projectList = React.createElement(ProjectDetailList,{context:this._context, appProperties: this._currentAppProperties, globalContext: this._globalContext});
      ReactDOM.render(React.createElement(Fabric, null, this._projectList), container);
    }, (error:any) =>{console.log(error)});
  }

  public updateView(context: ComponentFramework.Context<IInputs>): void {
    // storing the latest context from the control.
    this._context = context;
    this._globalContext = Xrm.Utility.getGlobalContext();
    this._globalContext.getCurrentAppProperties().then((appProperties:any) =>{
      this._currentAppProperties = appProperties;
      ReactDOM.render(React.createElement(Fabric, null, React.createElement(ProjectDetailList,{context:this._context, appProperties: this._currentAppProperties, globalContext: this._globalContext})), this._container);
    }, (error:any) =>{console.log(error)});
    console.log("NEW CONTEXT!!!! ->>>>>>>>>>>>>>>>>>>>>>>")
    console.log(this._currentAppProperties);
    console.log(context);
    console.log(this._context);

  }

【问题讨论】：

您有机会查看我的答案吗？

标签： powerapps react-tsx powerapps-modeldriven powerapps-component-framework

【解决方案1】：

您需要调用notifyOutputChanged，后者又会调用updateView

PCF PM words:

NotifyOutputChange 调用 CRM 客户端层来更新值，它使表单变脏（退出前保存）。此外，所有业务层逻辑（如 clientAPI、PBL 和字段验证）都已启动。如果不需要，并且控件只需要更改 UI，您可以跳过 notifyOutputChange。

控件重新加载、页面大小调整和外部业务逻辑更新控件值触发UpdateView。

在 React 框架中 - 你应该像下面这样：

我们需要创建一个notifyChange函数，它会更新PCF的输出值，并在我们的PCF组件中调用notifyOutputChanged。

我们可以将 notifyChange 函数作为 props 的一部分传递给我们的自定义 React 组件。每当在我们的 React 组件中更新值时，都会执行 notifyChange 函数，该函数随后会调用 notifyOutputChanged 来更新输出值并随后在 PowerApps Form 上触发 onChange 事件。

Learn more

【讨论】：