ASP.NET Core：如何在单视图模型下处理显示与提交数据不同的表单

下面提供几种可行的实现方式，均适配单个视图仅能绑定一个视图模型的场景，兼顾数据展示与表单提交需求：

1. 创建复合视图模型（推荐） #

直接定义一个包含展示模型和提交模型的复合类，视图绑定该复合模型即可。这种方式保留强类型支持，编译阶段就能检查错误，是最规范且常用的方案。

复合模型代码示例： #

public class ConsentCompositeViewModel
{
    // 用于展示的信息模型
    public SomeInfo DisplayInfo { get; init; }
    
    // 用于接收提交数据的模型
    public ViewModel SubmitData { get; set; } = new();
}

控制器端处理： #

public IActionResult Consent()
{
    // 构造展示数据
    var displayInfo = new SomeInfo
    {
        DisplayName = "示例服务",
        SomeDictionary1 = new Dictionary<string, string> { ["key1"] = "权限1" },
        // 其他属性按需初始化
    };
    
    var compositeModel = new ConsentCompositeViewModel
    {
        DisplayInfo = displayInfo
    };
    
    return View(compositeModel);
}

[HttpPost]
public IActionResult Consent(ConsentCompositeViewModel model)
{
    if (ModelState.IsValid)
    {
        // 从model.SubmitData获取提交的Denied、ConsentedSomeDictionary1Keys等数据
        // 执行业务逻辑
        return RedirectToAction("Success");
    }
    
    // 验证失败时重新填充DisplayInfo，避免展示数据丢失
    model.DisplayInfo = GetDisplayInfo();
    return View(model);
}

视图端使用： #

@model ConsentCompositeViewModel

<!-- 展示数据部分 -->
<h1>@Model.DisplayInfo.DisplayName</h1>
<img src="@Model.DisplayInfo.LogoUri" alt="服务Logo" />

<!-- 表单提交部分，绑定到SubmitData的属性 -->
<form asp-action="Consent" method="post">
    <div>
        <label>
            <input type="checkbox" asp-for="SubmitData.Denied" />
            拒绝所有权限
        </label>
    </div>
    
    <!-- 遍历展示SomeDictionary1的权限选项，绑定到ConsentedSomeDictionary1Keys -->
    @foreach (var kvp in Model.DisplayInfo.SomeDictionary1)
    {
        <div>
            <label>
                <input type="checkbox" 
                       name="SubmitData.ConsentedSomeDictionary1Keys" 
                       value="@kvp.Key" 
                       @(Model.SubmitData.ConsentedSomeDictionary1Keys.Contains(kvp.Key) ? "checked" : "") />
                @kvp.Value
            </label>
        </div>
    }
    
    <div>
        <label>
            <input type="checkbox" asp-for="SubmitData.Remember" />
            记住我的选择
        </label>
    </div>
    
    <button type="submit">提交</button>
</form>

2. 使用ViewBag/ViewData传递展示数据 #

如果不想创建新的复合模型，可将SomeInfo实例存入ViewBag或ViewData，视图从这里读取展示数据，表单则直接绑定原ViewModel。这种方式无需额外类，但失去强类型的编译检查，适合简单场景。

控制器端处理： #

public IActionResult Consent()
{
    ViewBag.DisplayInfo = new SomeInfo
    {
        DisplayName = "示例服务",
        SomeDictionary1 = new Dictionary<string, string> { ["key1"] = "权限1" },
        // 其他属性按需初始化
    };
    
    return View(new ViewModel());
}

[HttpPost]
public IActionResult Consent(ViewModel submitModel)
{
    if (ModelState.IsValid)
    {
        // 处理提交数据
        return RedirectToAction("Success");
    }
    
    // 验证失败时重新填充ViewBag
    ViewBag.DisplayInfo = GetDisplayInfo();
    return View(submitModel);
}

视图端使用： #

@model ViewModel

@{
    var displayInfo = ViewBag.DisplayInfo as SomeInfo;
}

<!-- 展示数据部分 -->
<h1>@displayInfo.DisplayName</h1>
<img src="@displayInfo.LogoUri" alt="服务Logo" />

<!-- 表单提交部分，直接绑定到ViewModel的属性 -->
<form asp-action="Consent" method="post">
    <div>
        <label>
            <input type="checkbox" asp-for="Denied" />
            拒绝所有权限
        </label>
    </div>
    
    @foreach (var kvp in displayInfo.SomeDictionary1)
    {
        <div>
            <label>
                <input type="checkbox" 
                       name="ConsentedSomeDictionary1Keys" 
                       value="@kvp.Key" 
                       @(Model.ConsentedSomeDictionary1Keys.Contains(kvp.Key) ? "checked" : "") />
                @kvp.Value
            </label>
        </div>
    }
    
    <div>
        <label>
            <input type="checkbox" asp-for="Remember" />
            记住我的选择
        </label>
    </div>
    
    <button type="submit">提交</button>
</form>

3. 隐藏字段传递展示数据（不推荐） #

如果展示数据需要在提交时一并传回后端，可将SomeInfo的关键属性序列化为隐藏字段，但这种方式仅适合数据量小、非敏感的场景，且字典类型需特殊处理（比如序列化为JSON字符串），维护成本较高，一般不推荐使用。

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