我使用NativeBase中的popover組件來創(chuàng)建我的Popover:

const SettingsButton: React.FC<Props> = () => {
    return (
        <Popover
            trigger={(triggerProps) => {
                return (
                    <Button {...triggerProps} variant={'ghost'}>
                        <HamburgerIcon size="xl" color="lightText" />
                    </Button>
                );
            }}
        >
            <SettingsPopover />
        </Popover>
    );
};

(完整App在此，Popover在此)

我希望彈出窗口后面的頁面是可滾動的，類似于當(dāng)您的設(shè)置/配置文件彈出窗口打開時，您可以滾動Github頁面。

到目前為止，我能想到的最好的辦法就是

onOpen={() => {
    document.body.style.overflow = 'scroll';
}}
onClose={() => {
    document.body.style.overflow = 'hidden';
}}

在我的Popover-Component中，但這增加了第二個滾動條，并在滾動時直接關(guān)閉Popover(在移動版本的應(yīng)用程序中，它不會改變?nèi)魏螙|西)，這是一個有點糟糕的解決方案，我認為肯定有更好的方法。

我相信立場:固定；你想做什么就做什么。

位置:固定；使彈出窗口保持在適當(dāng)?shù)奈恢茫还芤暱谠谀睦铮梢允褂胻op、left或其他CSS配置它顯示的位置。

固定的；不變的 該元素將從普通文檔流中刪除，并且不會在頁面布局中為該元素創(chuàng)建任何空間。它相對于由視口建立的初始包含塊進行定位，除非它的某個祖先將transform、perspective或filter屬性設(shè)置為n one以外的值(請參見CSS Transforms規(guī)范)，或者將will-change屬性設(shè)置為transform，在這種情況下，該祖先的行為與包含塊相同。(請注意，瀏覽器在透視和過濾器方面存在不一致，這有助于抑制塊的形成。)它的最終位置由top、right、bottom和left的值決定。

位置- MDN