menu icon indicating copy to clipboard operation
menu copied to clipboard

在nextjs13中onOpenChange可以改变openkeys,但是改变后,菜单不能收起

Open ideaviewes opened this issue 2 years ago • 0 comments

代码如下

  const renderTable = (nodes: TableItem[]) => {
    return nodes.map((item) => {
      if (!item.children) {
        return (
          <MenuItem
            className={'flex h-10 items-center rounded-md text-sm hover:bg-gray-100'}
            key={item.key}
          >
            {item.label}
          </MenuItem>
        );
      }
      return (
        <SubMenu
          className={'cursor-pointer text-sm'}
          key={item.key}
          title={
            <div className={'flex h-10 items-center justify-between rounded-md text-sm'}>
              {item.label}
            </div>
          }
        >
          {renderTable(item.children)}
        </SubMenu>
      );
    });
  };

  const [openKeys, handleOpenKeys] = useState<string[]>([]);
  const onOpenChange = (openKeys: string[]) => {
    handleOpenKeys(openKeys);
  };

          <Menu
            className={'doc-table w-full px-2'}
            mode={'inline'}
            openKeys={openKeys}
            onOpenChange={onOpenChange}
          >
            {renderTable(items)}
          </Menu>

可以打开子菜单,但是关闭不了,点击的时候,打印可以看到openKeys已经发生了改变,但是子菜单还是收不回去

ideaviewes avatar Apr 16 '23 08:04 ideaviewes