Question

我正在使用reactSearch构建一个仪表板，其中包含一些过滤器（MultiList），例如国家/地区，状态等。我有一个表，其中一些行在reactList中呈现。

我有一个工具栏，可用于更改表格上的特定属性。例如，如果我需要将行的状态从待处理更改为保留（此工具栏不是reactSearch组件）。根据状态更改调用的反馈，我如何重新渲染reactBase组件以更新计数并更新行以反映更新后的状态。

我尝试过的选项是 1）在状态更新发生时将MultiList过滤器值设置为random，在状态更新完成时将其设置为实际值，以触发重新渲染。但这并不更新过滤器的数量。而且，表行的状态也不会持续更新。

2）重新加载网页（此方法有效，但想将其保存为万不得已）

// reactjs

<MultiList
   componentId="stateFilter"
   dataField="state"
   value={this.state.stateValue}
   onChange ={this.onChange}
   ...
 />

shouldComponentUpdate(nextProps, nextState) {
    if(this.props.isStateSaving && !nextProps.isStateSaving) {
      this.setState({ stateValue : [] });
    } else {
      this.setState({ stateValue : ['All States'] });
    }
    return true;
  }

预期结果是保存状态后，应更新过滤器和表行的计数以反映实际状态。

Answer 1

如果要基于过滤器的值更新结果，则可以使用react道具，该道具根据react道具中的值更新结果。为了更好地理解该道具，您可以阅读文档here。如果这不是您想要的，最好提供CodeSandbox或CodePen链接。

希望这会有所帮助！

如何根据外部事件/外部组件更新过滤器计数和表格结果

1 个答案: