MudBlazor如何在浏览器窗口右下角显示通知？

你遇到的问题核心两点：一是直接传"BottomRight"作为PositionClass不符合MudBlazor的预设类名规则，二是Snackbar默认会被限制在当前布局容器内（比如MudMainContent），导致被MudAppBar干扰定位。以下是具体解决步骤：

1. 使用正确的定位类名 #

MudBlazor的Snackbar定位需要用框架预设的CSS类，不是直接传纯文本字符串。修改你的方法：

private void ShowNotification()
{
    Snackbar.Clear();
    // 用Position枚举获取正确类名，或者直接写"mud-snackbar-position-bottom-right"
    Snackbar.Configuration.PositionClass = Position.BottomRight.ToString();
    Snackbar.Add(message, Severity.Normal);
}

2. 强制Snackbar全局视口定位（方法1无效时用） #

如果还是被布局容器限制，在全局样式文件（比如wwwroot/css/app.css）里添加以下CSS，强制Snackbar相对于浏览器窗口固定定位：

/* 确保右下角Snackbar层级高于AppBar，不受布局容器约束 */
.mud-snackbar-container.mud-snackbar-position-bottom-right {
    position: fixed !important;
    bottom: 20px;
    right: 20px;
    z-index: 9999;
}

3. 全局配置Snackbar（更省心的方案） #

直接在Program.cs里全局设置Snackbar的默认位置，所有组件调用时无需再单独配置位置，彻底避免布局影响：

builder.Services.AddMudServices(config =>
{
    config.SnackbarConfiguration = new SnackbarConfiguration
    {
        PositionClass = Position.BottomRight,
        // 可按需添加其他配置，比如显示时长、是否去重等
        VisibilityDuration = 3000,
        PreventDuplicates = true
    };
});

之后你的方法可以简化为：

private void ShowNotification()
{
    Snackbar.Add(message, Severity.Normal);
}

内容的提问来源于stack exchange，提问作者ZedZip