我如何在无状态的React中填充DropdownList选项？

Question

我不想使用状态，因为这是我的第二个下拉列表，并且与第一个下拉列表相连。而且我发现当我做this.setstate(...);时，反应是重新渲染的，它打破了我的第一个下拉列表，每个选择的表单都没有选择。所以我想用这个：

const data =[{
   "tablename": "demo_1",
   "segments": "asd"
},
{
   "tablename": "demo_2",
   "segments": "dsa"
}];

我想要这样简单的东西：

有可能这样做吗？我搜索了但找不到合适的答案。

Answer 1

在我看来，您的组件状态在组件层次结构中的地位还不够高。尝试将状态存储在父组件中，并将其作为道具传递给下拉列表。

Answer 2

不建议这样做，但是如果必须保留两个下拉菜单，则可以尝试shouldComponentUpdate来防止重新渲染。这里是一个示例。

 shouldComponentUpdate(nextProps, nextState) {
    if (this.state... == nextState...) {
      return false;
    }
    return true;
  }