在本教程中,将学习如何在ASP.NET Core MVC中创建一个简单的项目,并通过添加服务、定义模型和视图来构建一个基本的应用程序。还将探讨如何使用布局页面和导入页面来重用和共享视图之间的视觉元素和公共代码。
首先,需要创建一个ASP.NET Core MVC项目。在创建项目后,需要修改Startup类以添加MVC的服务和中间件。
public void ConfigureServices(IServiceCollection services)
{
services.AddScoped();
services.AddMvc();
}
public void Configure(IApplicationBuilder app, IHostingEnvironment env)
{
app.UseMvc(routes =>
{
routes.MapRoute(
name: "default",
template: "{controller=Home}/{action=Index}/{id?}");
});
}
在上述代码中,向服务容器中添加了一个名为IGreetingService的接口和一个名为GreetingService的实现类。还配置了MVC中间件,并定义了一个默认路由。
接下来,定义一个服务接口和模型。
public interface IGreetingService
{
string Greet(string firstname, string surname);
}
public class GreetingService : IGreetingService
{
public string Greet(string firstname, string surname)
{
return $"Hello {firstname} {surname}";
}
}
public class UserViewModel
{
public string Firstname { get; set; }
public string Surname { get; set; }
}
在这段代码中,定义了一个IGreetingService接口,它有一个Greet方法,用于生成问候语。还定义了一个GreetingService类,它是IGreetingService的实现。此外,还定义了一个UserViewModel类,用于存储用户的名字和姓氏。
现在,需要添加一个控制器和相应的视图。
public IActionResult Index()
{
var model = new UserViewModel
{
Firstname = "Tahir",
Surname = "Naushad"
};
return View(model);
}
在这段代码中,定义了一个Index方法,它创建了一个UserViewModel对象,并将其作为模型传递给视图。
布局页面用于在页面之间共享公共视觉元素。将创建一个名为_Layout.cshtml的布局页面,并将其添加到Views/Shared文件夹中。
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width"/>
<title>@ViewBag.Title</title>
</head>
<body>
<div>
<h1>I'm in Layout page</h1>
@RenderBody()
@RenderSection("footer", required: false)
@if (IsSectionDefined("links"))
{
@RenderSection("links", required: false)
}
else
{
<em>No social media links supplied</em>
}
</div>
</body>
</html>
在布局页面中,使用@RenderBody方法来渲染视图的内容。还使用@RenderSection方法来决定视图中定义的节将放置在哪里。这些节可以是必需的或可选的。
接下来,需要添加一个名为Index.cshtml的视图。
@model UserViewModel
@{
ViewBag.Title = "ASP.NET Core MVC";
}
<h2>I'm in View page</h2>
<p>@Greeter.Greet(@Model.Firstname, @Model.Surname)</p>
@section footer{
<h3>I'm in footer section</h3>
}
在视图中,使用@model指令来指定模型类型。还使用@ViewBag.Title来设置页面标题。此外,还使用@section指令来定义一个名为footer的节。
导入页面用于声明对一个或多个视图通用的指令。将创建一个名为_ViewImports.cshtml的导入页面,并将其添加到Views文件夹中。
@using Fiver.Mvc.Layout.Models.Home
@inject IGreetingService Greeter
在导入页面中,使用@using指令来导入命名空间,使用@inject指令来注入依赖项。
启动页面用于运行对所有视图通用的代码。将创建一个名为_ViewStart.cshtml的启动页面,并将其添加到Views文件夹中。
@{
Layout = "_Layout";
}
在启动页面中,使用Layout属性来设置所有视图使用的布局页面。