reactjs - 单击表格行后生成新选项卡

Question

单击表格行后，我尝试添加新选项卡。

我想我错过了 Props 或 State 来动态制作它？

表格组件：

   <tr {...row.getRowProps()} onClick={ (e) => Test(row.values)} />

第二个监听点击事件的组件：

   function Test(data) {
      return (
          <>
            {Object.keys(data).map(key =>
              <Tab key={key}>{key}</Tab>
            )}
          </>
      )
}

用表格填充选项卡的第三个组件：

   const TabTable = () => {
    return (
        <div>
            <Tabs>
                <TabList>
                    <Tab key="Main">Main</Tab>
                    <Test />
                </TabList>
                <TabPanel>
                    <LoadData />
                </TabPanel>
            </Tabs>
        </div>
    );
}

LoadData 是一个表。

是的，我在 TabTable 和 LoadTable 组件中使用 import Test，它只是片段。

我没有使用道具或状态。使用默认导出。

这可能是为什么它在没有 Props 或 State 的情况下不能动态运行的原因吗？