ASP.NET Core视图中为不同状态的ViewData设置不同样式类

你可以通过Razor视图的条件判断逻辑，根据ViewData["Active"]存储的枚举值动态设置CSS类，以下是几种常用的实现方式：

方式一：Switch语句（结构清晰，适合多状态场景） #

首先在视图顶部引入枚举所在的命名空间（替换为你项目中实际的命名空间）：

@using YourProjectNamespace.Enums;

然后添加以下代码：

@{
    // 将ViewData的值转换为可空枚举，避免空引用异常
    var activeStatus = ViewData["Active"] as ActiveEmailResult?;
    if (activeStatus.HasValue)
    {
        string alertClass = string.Empty;
        string statusMessage = string.Empty;

        switch (activeStatus.Value)
        {
            case ActiveEmailResult.Success:
                alertClass = "alert-success";
                statusMessage = "You Are Active";
                break;
            case ActiveEmailResult.NotActive:
                alertClass = "alert-danger";
                statusMessage = "You Are not Active.";
                break;
            case ActiveEmailResult.Error:
                alertClass = "alert-danger"; // 也可自定义error专属的CSS类，比如alert-warning
                statusMessage = "You Have Error";
                break;
        }

        // 仅当状态有效时渲染提示框
        if (!string.IsNullOrEmpty(alertClass))
        {
            <div class="alert @alertClass" role="alert">
                @statusMessage
            </div>
        }
    }
}

方式二：模式匹配表达式（代码简洁，C# 8.0+支持） #

同样先引入枚举命名空间，然后使用简洁的模式匹配：

@using YourProjectNamespace.Enums;

@{
    var activeStatus = ViewData["Active"] as ActiveEmailResult?;
    if (activeStatus.HasValue)
    {
        string alertClass = activeStatus.Value switch
        {
            ActiveEmailResult.Success => "alert-success",
            ActiveEmailResult.NotActive or ActiveEmailResult.Error => "alert-danger",
            _ => string.Empty
        };

        string statusMessage = activeStatus.Value switch
        {
            ActiveEmailResult.Success => "You Are Active",
            ActiveEmailResult.NotActive => "You Are not Active.",
            ActiveEmailResult.Error => "You Have Error",
            _ => string.Empty
        };

        if (!string.IsNullOrEmpty(alertClass))
        {
            <div class="alert @alertClass" role="alert">@statusMessage</div>
        }
    }
}

方式三：直接分支判断（适合简单场景） #

如果状态较少，也可以直接用if-else分支渲染不同元素：

@using YourProjectNamespace.Enums;

@if (ViewData["Active"] is ActiveEmailResult.Success)
{
    <div class="alert alert-success" role="alert">You Are Active</div>
}
else if (ViewData["Active"] is ActiveEmailResult.NotActive)
{
    <div class="alert alert-danger" role="alert">You Are not Active.</div>
}
else if (ViewData["Active"] is ActiveEmailResult.Error)
{
    <div class="alert alert-danger" role="alert">You Have Error</div>
}

注意事项 #

• 必须确保视图能识别ActiveEmailResult枚举，所以一定要添加对应的命名空间引用。
• 使用可空枚举ActiveEmailResult?是为了处理ViewData["Active"]未赋值（为空）的情况，避免空引用异常。

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