asp.net core练手小项目(03) - 实现 CRUD 操作

本篇完成 CRUD 操作，数据访问部分暂时不连接数据库，使用模拟的实现。为了方便以后切换到真正数据库上，Repository 基于接口实现，在 IStudentRepository 接口中有如下方法：

namespace StudentManagement.Models
{
    public interface IStudentRepository
    {
        Student GetStudent(int id);
        IEnumerable<Student> GetAllStudents();
        Student Update(Student student);
        Student Create(Student student);
        Student Delete(int id);
    }
}

模拟 CRUD 的实现代码放在 MockStudentRepository 类中：

namespace StudentManagement.Models
{
    public class MockStudentRepository : IStudentRepository
    {
        private List<Student> students;

        public MockStudentRepository()
        {
            students = new List<Student>() { 
                new Student()
                {
                    Id = 1, Name = "张三", Major = "计算机科学"                   
                },
                new Student()
                {
                    Id = 2, Name = "李四", Major = "人工智能"
                },
                new Student()
                {
                    Id = 3, Name = "王五", Major = "电子商务"
                }
            };

        }

        public Student Create(Student student)
        {
            student.Id = students.Max(s => s.Id) + 1;            
            students.Add(student);
            return student;
        }

        public Student Delete(int id)
        {
            var student = this.GetStudent(id);
            if (student != null)
            {
                students.Remove(student);
            }
            return student;
        }

        public IEnumerable<Student> GetAllStudents()
        {
            return students;
        }

        public Student GetStudent(int id)
        {
            return students.FirstOrDefault(s => s.Id == id);
        }

        public Student Update(Student student)
        {
            Student s = this.GetStudent(student.Id);
            if (s != null)
            {
                s.Name = student.Name;
                s.Major = student.Major;
            }

            return s;
        }
    }
}

Create 功能实现

实现创建学生的功能，从操作的流程上来说，首先需要从浏览器发送 HTTP Get 请求，允许用户进入到创建学生的页面，在该页面中输入数据后，再提交一个 Post 请求，控制器接收 Post 请求的数据，调用 IStudentRepository 的方法，实现数据持久化。

因为项目启动时显示的是学生列表界面，所以我们在 index 页面 (index.cshtml) 中，增加一个跳转到创 /student/create 的http 请求 ：

在 StudentController 中编写处理 HTTP Get 请求的代码。根据默认路由规则，View() 返回到 /student/create 页面：

编写 Views/Student/Create.cshtml 页面：

注意到页面的标签并不是常规的 html 标签，而是使用被称为 asp.net core Tag Helper 的标签。关于 tag helper 的用法，请参考Tag Helpers in ASP.NET Core | Microsoft Docs。在本例中用到的 tag helper 比如：

<input asp-for="Major" placeholder="请输入专业" />

编译后变成：

<input placeholder="请输入专业" type="text" id="Major" name="Major" value="" />

form 标签：

<form method="post" asp-controller="student" asp-action="create">

编译后变成：

<form method="post" action="/student/create">

使用 TagHelper 不仅更加简单，还更加灵活。为了能使用 TagHelper，需要在项目中添加 _ViewImports.cshtml (视图导入）文件，在文件中通过 @addTagHelper 指令添加允许的 TagHelper:

@addTagHelper *, Microsoft.AspNetCore.Mvc.TagHelpers

点击创建按钮，回到 Controller 处理 Post 请求：

完成以上编码后，界面效果：

点击「创建」按钮，Controller 处理 Get 请求，跳转到 /student/create：

输入数据后点击「创建」按钮，Controller 处理请求，将数据保存，然后跳转到 index 页：

Edit 功能实现

处理流程与 Create 功能类似，包括如下步骤：

1）index 页面编写跳转到编辑 的 Get 请求代码，请求 Path: /student/edit/{id}
2) StudentController 处理 Get 请求，跳转到 /student/edit/{id} 指向的界面
3) 在 /student/edit/{id} 指向的界面中输入数据，提交 Post 请求
4) StudentController 处理 接收到的Post 请求，数据保存到数据库，并且重定向到 index 页面

以下是相关代码。StudentController 的代码部分：

Edit.cshtml 代码：

Delete 功能实现

1）index 页面中添加链接，提交 Get 请求，路径为 /student/delete/{id}。之所以用 Get 请求，是为了让界面和 浏览、编辑等保持一致，而且 Delete 不需要界面，Controller 直接处理就行了。
2）StudentController 处理请求，删除数据，并且重定向到 index:

源码

源码托管在 gitee aspnetcore-studentmanagement，为了记录完整的编写过程，重要的步骤提交 tag 进行标记，本次代码 tag 为 v0.03。