IT数码 购物 网址 头条 软件 日历 阅读 图书馆
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
图片批量下载器
↓批量下载图片,美女图库↓
图片自动播放器
↓图片自动播放器↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁
 
   -> 开发测试 -> VSCode创建ASP.NET Core MVC项目(1:实现浏览及查看明细功能) -> 正文阅读

[开发测试]VSCode创建ASP.NET Core MVC项目(1:实现浏览及查看明细功能)

??基于微软的ASP.NET Core教程(参考文献1),学习并以MVC方式实现电影数据的增删改查、搜索、验证等功能。本文主要实现其中的浏览及查看明细功能。
??首先创建MVC项目。在VSCode的终端中输入以下命令创建项目:

	//创建项目
	dotnet new mvc -o TestMVCMySql  
	//加载项目
	code -r TestMVCMySql

??之前的项目中已经创建了电影数据库,同时在数据库中录入了测试数据,本项目直接连接并处理该数据库即可。在项目中添加如下程序集的引用。

Microsoft.EntityFrameworkCore.Design
Microsoft.EntityFrameworkCore.Tools
MySql.EntityFrameworkCore

??MVC项目自动创建了Models、Views和Controllers文件夹,MVC模式对应的模型、视图和控制器文件即放在这三个文件夹中,其中模型文件夹主要存放系统中使用的数据类,控制器文件夹中主要存放与页面交互的处理类,而视图文件夹主要存放与控制器类中的公开函数对应的视图模板文件。一般来讲,Controllers文件夹下每个继承了Controller的控制器类都对应着Views文件夹下的一个子文件夹(子文件夹名称为控制类名中在Controller 之前的部分,例如控制器名为HomeController,则在Views文件夹下会有一个名为Home的子文件夹);Views文件夹中控制器类对应的子文件夹下的一个页面都对应着控制器类中的公开函数(页面名称为控制器类中的公开函数名称,如Home文件夹下的Index.chtml页面对应着HomeController类中的Index函数)。
??路由是ASP.NET Core MVC项目的重要概念之一,根据目前学习的内容来看,其作用主要是将对页面的请求定位到某个控制器类的特定公开函数中,并传递函数需要的参数。普通的ASP.NET Core 项目,每个Razor页面都对应有相应的处理类,如下图所示,处理类中会响应页面中的OnGet等事件。而在MVC项目中则需要通过路由定位处理页面交互请求的操作函数。微软帮助文档中对MVC模式的介绍:“此模式有助于实现关注点分离:UI 逻辑位于视图中。 输入逻辑位于控制器中。 业务逻辑位于模型中。 这种隔离有助于控制构建应用时的复杂程度,因为它可用于一次处理一个实现特性,而不影响其他特性的代码‘’。
在这里插入图片描述
??MVC项目的Startup文件中,在Configure函数中设置路由格式,代码如下所示:

        public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
        {
            ...

            app.UseEndpoints(endpoints =>
            {
                endpoints.MapControllerRoute(
                    name: "default",
                    pattern: "{controller=Home}/{action=Index}/{id?}");
            });
        }

??上述代码将网址格式分为了4段:第一段是服务器地址和端口,这段内容在代码中没有体现,不过访问同一网站时该段内容都相同;第二段是控制器,也即代码中的controller值,通过这段内容可以定位到项目中具体的控制器类(第二段内容加上Controller后缀即可);第三段是操作,也即代码中的action,通过这段内容可以定位到控制器中的具体函数(一般来说与函数名称相同,不过也有例外);第四段是路由数据,也即代码中的{id?},个人理解是传递给函数的参数值。代码中同时设置了controller和action的默认值,也即如果用户只输入服务器地址和端口时访问的地址,默认controller为Home,action为Index,如下图所示,在浏览器地址栏中输入https://localhost:5001/和https://localhost:5001/home/index,得到的页面是相同的。
在这里插入图片描述??接下来实现浏览及查看明细功能。首先定义模型及数据库连接类,这里偷一下懒,直接将之前项目中的电影类及数据库连接类复制到Models文件夹下,修改文件中的命名空间即可。然后在StartUp的ConfigureServices中注册数据类连接类即可。
??项目创建后,会在controller文件夹下默认创建HomeController控制类,将其更名为MovieController(同时要更改StartUp文件中Configure函数内的默认路由),然后将MovieController类中的构造函数参数由日志服务改为数据类连接类,同时创建Index和Details公开函数,其中Index函数返回数据库中的所有数据,Details函数返回指定id的电影数据。程序主要代码如下:

public class MovieController : Controller
    {
        private readonly RazorPagesMovieContext _context;

        public MovieController(RazorPagesMovieContext context)
        {
            _context = context;
        }

        public IActionResult Index()
        {
            var result=_context.Movies;        
            return View(result.ToArray());
        }

        public IActionResult Details(int? id)
        {
            if (id == null)
            {
                return NotFound();
            }

            var movie = _context.Movies.Find(id);

            if (movie == null)
            {
                return NotFound();
            }

            return View(movie);
        }
    }

??在项目的Views/Movie文件夹下创建Index和Details页面,本文直接从之前的项目中复制了这两个页面。复制过来之后,需要把页面开头的@page去掉,同时将页面中的跳转页面都修改为符合MVC项目要求的形式。Razor页面中的跳转,直接用asp-page和asp-route-id指定了要跳转的页面及参数,而在MVC项目中,需要使用asp-controller、asp-action和asp-route-id等定位点标记进行定位。
??同时,从控制类向页面传递参数的方式也有变化,在Razor页面中,通常是在页面对应的cs文件中定义公开属性,然后在页面开头处用@model定义要使用的属性。而在MVC项目中,由上面的示意代码可以看出,如果函数返回的是View(XXX)的形式,则项目基于视图文件中与函数名对应的页面文件模板生成响应内容,页面需要的数据以参数的形式传入。
??程序运行后的截图如下所示:
在这里插入图片描述在这里插入图片描述
??本文主要实现了基于MVC的电影数据的浏览及查看明细功能,这两类功能主要是控制类响应页面的Get请求,后续还会继续学习ASP.NET Core MVC帮助文档,实现对数据的增、删、改的功能。
??通过学习微软的ASP.NET Core文档及示例代码,同时对比之前学的Razor页面项目,形成了本文档。初学乍到,可能对ASP.NET Core 的内容理解有偏僻,不妥之处可以相互交流。

参考文献:
[1]https://docs.microsoft.com/zh-cn/aspnet/core/tutorials/first-mvc-app/start-mvc?view=aspnetcore-5.0&tabs=visual-studio-code

  开发测试 最新文章
pytest系列——allure之生成测试报告(Wind
某大厂软件测试岗一面笔试题+二面问答题面试
iperf 学习笔记
关于Python中使用selenium八大定位方法
【软件测试】为什么提升不了?8年测试总结再
软件测试复习
PHP笔记-Smarty模板引擎的使用
C++Test使用入门
【Java】单元测试
Net core 3.x 获取客户端地址
上一篇文章      下一篇文章      查看所有文章
加:2021-07-13 17:47:30  更:2021-07-13 17:48:18 
 
开发: C++知识库 Java知识库 JavaScript Python PHP知识库 人工智能 区块链 大数据 移动开发 嵌入式 开发工具 数据结构与算法 开发测试 游戏开发 网络协议 系统运维
教程: HTML教程 CSS教程 JavaScript教程 Go语言教程 JQuery教程 VUE教程 VUE3教程 Bootstrap教程 SQL数据库教程 C语言教程 C++教程 Java教程 Python教程 Python3教程 C#教程
数码: 电脑 笔记本 显卡 显示器 固态硬盘 硬盘 耳机 手机 iphone vivo oppo 小米 华为 单反 装机 图拉丁

360图书馆 购物 三丰科技 阅读网 日历 万年历 2024年5日历 -2024/5/5 17:10:44-

图片自动播放器
↓图片自动播放器↓
TxT小说阅读器
↓语音阅读,小说下载,古典文学↓
一键清除垃圾
↓轻轻一点,清除系统垃圾↓
图片批量下载器
↓批量下载图片,美女图库↓
  网站联系: qq:121756557 email:121756557@qq.com  IT数码