问题：

我在使用Next UI 2.2.9版在Next.js中实现嵌套的JavaScript时遇到了一个问题...

可能原因：

默认情况下，closeOnSelect属性是true，它会导致父对象关闭。

解决方案：

使用下拉属性closeOnSelect，将值作为false传递给它。
变化
<Dropdown backdrop="blur">个
到
<Dropdown backdrop="blur" closeOnSelect={false}>个

<Dropdown backdrop="blur" closeOnSelect={false}>
    <DropdownTrigger>
        <Button variant="light">
            Process Team
        </Button>
    </DropdownTrigger>
    <DropdownMenu variant="light" aria-label="Static Actions">
        <DropdownItem>

            <Dropdown>

                <DropdownTrigger>
                    <Button variant="light">
                        Member
                    </Button>
                </DropdownTrigger>

                <DropdownMenu>
                    <DropdownItem className="text-black">List All Cases</DropdownItem>
                    <DropdownItem className="text-black">Reassign Cases</DropdownItem>
                </DropdownMenu>

            </Dropdown>

        </DropdownItem>
    </DropdownMenu>
</Dropdown>

字符串

• 同样，如果你有很多嵌套，那么为每个父节点传递closeOnSelect={false}。*
  当你有更多的水平：

<Dropdown backdrop="blur" closeOnSelect={false}>
    <DropdownTrigger>
        <Button variant="light">
            GrandParent
        </Button>
    </DropdownTrigger>
    <DropdownMenu variant="light" aria-label="Static Actions">
        <DropdownItem>
            <Dropdown backdrop="blur" closeOnSelect={false}>
                <DropdownTrigger>
                    <Button variant="light">
                        Parent
                    </Button>
                </DropdownTrigger>
                <DropdownMenu>
                    <DropdownItem className="text-black">
                        <Dropdown>
                            <DropdownTrigger>
                                <Button variant="light">
                                    Child
                                </Button>
                            </DropdownTrigger>
                            <DropdownMenu>
                                <DropdownItem className="text-black">Child 1</DropdownItem>
                            </DropdownMenu>
                        </Dropdown>
                    </DropdownItem>

                </DropdownMenu>

            </Dropdown>

        </DropdownItem>
    </DropdownMenu>
</Dropdown>

型
您也可以使用shouldCloseOnInteractOutside prop来启用当用户单击它之外的任何位置时关闭插件的功能。因为它有助于关闭多级插件。

shouldCloseOnInteractOutside={()=> true}

型
此外，按钮宽度不是100%，您可以使用Button Prop fullWidth并将其传递给Boolean true以使其成为100%。

<Button fullWidth={true} variant="light">

型

请阅读：

1.**下拉 prop ：**https：//nextui.org/docs/components/dropdown#dropdown-props （滚动到页面底部）
1.下拉事件shouldCloseOnInteractOutside：https://nextui.org/docs/components/dropdown#dropdown-events
1.**按钮 prop **：https://nextui.org/docs/components/button#button-props

• 如果您还有任何疑问，请留下评论。如果这个答案解决了您的问题，您可以将其标记为答案。*