靶区; DR

简而言之，将Popover内容（子对象） Package 在<Resizable>中，而不是Popover本身，以调整其大小。

解释

是的，可以使用re-resizable调整MUI Popover的大小。与底层Modal component一样，默认情况下，Popover的大小由其内容驱动。添加一个 Package 在Resizable中的子级[ren]将使您能够调整Popover的大小。例如：

<Popover
  open={!isStoredTabsNull()}
  onClose={handleClose}
  anchorEl={anchorEl}
  anchorOrigin={{
    vertical: "bottom",
    horizontal: "left"
  }}
>
  <Paper
    style={{
      backgroundColor: DefaultStyle.backgroundColor,
      overflow: "auto"
    }}
  >
    <Resizable>
      {storedTabs?.map((tabsGroup) => (
        <StoredTabsItem
          key={tabsGroup.id}
          storedTabsGroup={tabsGroup}
          projectFolder={projectFolder}
          openFiles={openFiles}
          overwriteState={overwriteState}
          tabs={tabs}
        />
      ))}
    </Resizable>
  </Paper>
</Popover>

• （在使用您的代码的这个示例中，我在Paper中添加了Resizable，因为Paper也从其内容中获取其高度，除非另有定义。）*

这将导致：

• • 工作代码沙盒：**https://codesandbox.io/s/mui-popover-with-re-resizeable-forked-t96dko?file=/demo.js

你可以使用“PaperProps”来给予这样的高度和宽度。不需要使用可调整大小。

<Popover
  open={!isStoredTabsNull()}
  onClose={handleClose}
  anchorEl={anchorEl}
  PaperProps={{
    style: { width: 400, height: 400 },
  }}
>
  <Paper
    style={{
      backgroundColor: DefaultStyle.backgroundColor,
      overflow: "auto",
    }}
  >
    {storedTabs?.map((tabsGroup) => (
      <StoredTabsItem
        key={tabsGroup.id}
        storedTabsGroup={tabsGroup}
        projectFolder={projectFolder}
        openFiles={openFiles}
        overwriteState={overwriteState}
        tabs={tabs}
      />
    ))}
  </Paper>
</Popover>;