使用Mud Blazor，如何在页面底部找到一个持久的抽屉？

Question

查看以下文档：https://mudblazor.com/components/drawer

我可以得到一个临时抽屉在页面底部，这不满足我的需要，因为我希望它保持开放，而用户导航我的其他网站。我也不想让屏幕的其余部分变暗。

我可以在页面的左边或右边找到一个持久的抽屉，但这也不能满足我的需要，因为它必须在底部。

我尝试过的任何Anchor.Bottom和DrawerVariant.Persistent组合都不会编译。

什么是正确的方式使这一工作？

Answer 1

以下是泥巴的例子：

<MudDrawer @bind-Open="@open" Elevation="1" Variant="@DrawerVariant.Persistent" Color="Color.Primary" Anchor="@anchor" DisableOverlay="true" Style="left: 0; top:auto; bottom: 0; width: 100%; height: auto">
        <MudDrawerHeader>
            <MudText Typo="Typo.h6">Test</MudText>
        </MudDrawerHeader>
        <MudNavMenu>
            <MudNavLink Match="NavLinkMatch.All">test 1</MudNavLink>
            <MudNavLink Match="NavLinkMatch.All">test 2</MudNavLink>
            <MudNavLink Match="NavLinkMatch.All">test 3</MudNavLink>
        </MudNavMenu>
    </MudDrawer>
    <div class="d-flex justify-center align-center mud-height-full">
        <MudButton Variant="Variant.Text" OnClick="@(() => OpenDrawer(Anchor.Bottom))">Bottom</MudButton>
    </div>
@code {

bool open = false;
Anchor anchor;

void OpenDrawer(Anchor anchor)
{
    
    open = true;
    this.anchor = anchor;
}

}

它的内部问题是泥泞(如果你想的话，也可能是一个问题，以报告git)。我已经测试过了，这是可行的。我所做的是检查并看到临时抽屉和持久抽屉之间的区别，只有临时抽屉允许你修改锚。所以，如果你把这些样式添加到抽屉里，它应该能工作。

另外，暗屏幕是Overlay，当您调用组件时，可以使用禁用它。