ASP.NET Core 2.0中表单控件无法绑定到ViewModel的问题排查

嘿，我一眼就揪出问题啦！你的登录视图里的输入框没和LoginViewModel的属性绑定，导致ASP.NET Core的模型绑定没法识别表单提交的数据，最终loginViewModel才会变成null。

具体问题点 #

你现在的input标签只加了type、class和placeholder，缺了最关键的asp-for标签助手属性。比如用户名输入框：

<input type="text" class="form-control" placeholder="Username">

这个输入框没指定要绑定到LoginViewModel的哪个属性，表单提交时就不会携带对应的字段名和值，模型绑定自然没法创建有效的LoginViewModel实例。

修复后的登录视图代码 #

只需要给每个input标签加上asp-for属性，关联到ViewModel对应的属性就行：

@model LoginViewModel
<h2 class="my-4 text-center text-lg-left">Before contacting us, please log in or <a asp-action="Register" asp-controller="Account"> register!</a></h2>
<form asp-action="Login" asp-controller="Account" method="post" role="form">
    <!-- To show form error after submission -->
    <div asp-validation-summary="All" class="text-danger"></div>
    <div class="form-group">
        <label asp-for="UserName">User Name</label>
        <input type="text" asp-for="UserName" class="form-control" placeholder="Username">
        <span asp-validation-for="UserName" class="text-danger"></span>
    </div>
    <div class="form-group">
        <label asp-for="Password">Password</label>
        <input type="password" asp-for="Password" class="form-control" placeholder="Password">
        <span asp-validation-for="Password" class="text-danger"></span>
    </div>
    <button type="submit" class="btn btn-primary">Log In!</button>
</form>

为什么这样能解决问题？ #

asp-for标签助手会自动帮你完成两件核心事：

1. 生成和ViewModel属性名一致的name属性（比如name="UserName"），这是模型绑定识别字段的关键依据；
2. 自动应用ViewModel里定义的验证规则（比如[Required]），让前端验证也能正常工作。

修复完再测试表单提交，Login动作里的loginViewModel就能正确接收到用户输入的用户名和密码啦。

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