ASP.NET  CoreMVC 中的 ViewModel

Author Image
admin Thursday, June 3, 2021 阅读数: 87
Share:

本文出自 《从零开始学 ASP.NET Core MVC》目录
视频课程效果更佳:跨平台开发实战掌握 ASP.NET Core 与 EntityFramework Core

ASP.NET Core MVC 中的 ViewModel-视图模型

在这个视频中,我们将讨论学习:

  • 为什么我们需要在 ASP.NET Core MVC 中使用 ViewModel
  • 在 ASP.NET Core MVC 中制作一个 ViewModel 示例

为什么我们需要在 ASP.NET Core MVC 中使用 ViewModel

在某些情况下,模型对象可能无法包含视图所需的所有数据。 这个时候就需要使用 ViewModel 了。它会包含视图所需的所有数据。 请参考以下 Details()操作方法:

请注意,我们需要将学生的详细信息和 PageTitle 传递给 View。我们使用 Student 模型对象传递学生的详细信息,而使用 ViewBag 传递 PageTitle。

public class HomeController : Controller
{
   //其他代码
    public ViewResult Details()
        {
            Student model = _studentRepository.GetStudent(1);
            ViewBag.PageTitle = "Student Details";
            return View(model);
        }
}

使用 ViewBag 将数据从控制器传递到视图会创建一个弱类型的视图,因此我们不会得到智能提示和编译时类型和错误检查。

在 Student 类中包含 PageTitle 属性没有任何意义,因为 Student 类应该只包含与学生相关的属性。

这个时候我们就需要创建一个包含视图所需的所有数据的类。 该类称为 ViewModel。

ViewModel 示例

ViewModel 类可以存在于 ASP.NET Core MVC 项目的任何位置,但为了管理方便,我们通常将它们放在一个名为 ViewModels 的文件夹中

我们将 ViewModel 类命名为HomeDetailsViewModel。 我们的名称中有"Home"一词,因为 Controller 的名称是 HomeController。单词"Details"因为,操作方法的名称是 Details()

此 ViewModel 类包含视图所需的所有数据。通常,我们使用 ViewModels 在 View 和 Controller 之间传递数据。 因此,ViewModels 也简称为数据传输对象或 DTO。

数据传输对象==DTO

我们现在可以使用此 ViewModel 装载 Student 类的详细信息和 PageTitle,然后从 Controller 传递数据到视图

namespace StudentManagement.ViewModels
{
    public class HomeDetailsViewModel
    {
        public Student Student { get; set; }
        public string PageTitle { get; set; }
    }
}

Student 类位于 StudentManagement.Models 命名空间中,因此请不要忘记包含以下 using 语句。

using StudentManagement.Model;

在控制器中使用 ViewModel

  public ViewResult Details()
        {
           //实例化HomeDetailsViewModel并存储Student详细信息和PageTitle
            HomeDetailsViewModel homeDetailsViewModel = new HomeDetailsViewModel()
            {
                Student = _studentRepository.GetStudent(1),
                PageTitle = "Student Details"
            };

           //将ViewModel对象传递给View()方法
            return View(homeDetailsViewModel);
        }

在视图中使用 ViewModel

  • 该视图可以使用 View()帮助方法访问控制器中的 ViewModel 对象
  • 使用 指令,将 HomeDetailsViewModel 设置为视图的 Model
  • 然后我们就可以访问学生的详细信息和的 PageTitle 的属性
  • 请注意,@model 指令的小写字母为"m",@model 属性的大写字母为"M"
@model StudentManagement.ViewModels.HomeDetailsViewModel
<html>
  <head>
    <title></title>
  </head>
  <body>
    <h3>@Model.PageTitle</h3>
 
    <div>
      姓名 : @Model.Student.Name
    </div>
    <div>
      邮箱 : @Model.Student.Email
    </div>
    <div>
     主修科目 : @Model.Student.Major
    </div>
  </body>
</html>

文章说明

如果您觉得我的文章质量还不错,欢迎打赏,也可以订阅我的视频哦
未得到授权不得擅自转载本文内容,52abp.com 保留版权

感谢您对我的支持

关注微信公众号:角落的白板报

公众号:角落的白板报