Shulou(Shulou.com)06/01 Report--

This article mainly introduces "how to create Razor pages in ASP.NET Core". In daily operation, I believe many people have doubts about how to create Razor pages in ASP.NET Core. The editor consulted all kinds of materials and sorted out simple and easy-to-use methods of operation. I hope it will be helpful to answer the questions of "how to create Razor pages in ASP.NET Core". Next, please follow the editor to study!

Brief introduction

With ASP.NET Core 2 coming, the hottest new thing is the Razor page.

Razor pages are a new feature of ASP.NET Core that makes page-based programming easier and more efficient.

The public's first impression is that for small applications that focus only on pages, Razor pages can replace MVC more easily and faster. However, it turns out to be more powerful than this. When creating a new application with ASP.NET Core 2, the Razor page (empty, Razor page, Web API,MVC) is the default option, and it seems that the ASP.NET team has more plans for the Razor page and wants it to be the first choice when creating Web applications.

All Razor page types and features are in the Microsoft.AspNetCore.Mvc.RazorPages assembly, and the MVC default package Microsoft.AspNetCore.Mvc already contains Razor page components, which means that you can use Razor pages directly in MVC applications.

One of the advantages of Razor pages is that they are very easy to set up and create. You create a new empty project, add a Pages folder, add pages, and simply write code and tags in a .cshtml file. Very suitable for beginners, is a simple and fast way to learn ASP.NET Core!

Why?

If you want to build a few simple pages using MVC, you need to write the controller Action, HTML view, view model, and routing in a separate location, which seems outrageous.

In the Razor page, there is only one Razor file (.cshtml), and the background code is also located in this file, which also represents the URL structure of the application (which will be described later). So, you can put everything in one file, as simple as that.

However, you can separate the background code using the .cshtml.cs extension file. The view model and Handlers (such as the Acion method in MVC) are usually included in this file, as well as the processing logic in the file. Of course, you can also move your view model to a separate file.

Create a Razor page application

If we install the .NET Core 2 SDK in VS 2017 as follows: file-> New Project-> Web-> ASP.NET Core Web Application, we will get the following window:

Manually change the authentication type to personal user account.

We can also achieve the same effect through CLI

Dotnet new razor-auth Individual

After dotnet CLI creates a new project, we will get the following structure in the project:

First notice that there is no Views folder, and if you do not select the "authorization" option, there will be no "Controllers" folder. In our example, there is an AccountController controller that contains the Account folder in the Pages folder. In this folder, we store Razor pages. In MVC, these codes are usually placed in the ~ Views/Account folder:

The default location of the page is the "Pages" folder, but you can change it

Most pages come with .cs files that represent the model of the page:

In the .cs file, we can define our logic, Handlers (Action), model, and all the required logic. We can also think of it as the glue for .cshtml pages, dealing only with GET / POST / PUT / DELETE, or we can move logic into separate classes or layers / projects.

One thing to note is that we need to define the @ page directive at the top of the .cshtml file. This tells Razor that the .cshtml file is a Razor Page file:

ASP.NET Core Razor Page-Core Featur

Because Razor pages are part of the MVC framework, we can use any of the features that come with MVC in Razor pages.

Model binding

Model binding also applies to Razor pages in MVC, just like the Action method in the MVC controller, and there is a Handlers in the Razor page code.

Write the following form in the ChangePassword page .cshtml file:

Implement the ChangePasswordModel class in the ChangePassword.cshtml.cs file:

Here is the InputModel class:

InputModel provides the ViewModel functionality that we are familiar with in MVC.

Handlers

We use Handlers as the way to process HTTP requests (GET,POST,PUT,DELETE...). For example, we can do the following:

OnGet / OnGetAsyncOnPost / OnPostAsyncOnDelete / OnDeleteAsync

These methods will be automatically matched by ASP.NET Core based on the type of HTTP request.

Let's go back to the previous example of ChangePassword. This is part of the code from the ChangePassword.cshtml.cs file:

OnGetAsync and OnPostAsync are the agreed names of the Razor page handlers. Once you open the ChangePassword page, the OnGetAsync handler executes, and when you submit the form from the ChangePassword.cshtml page, the OnPostAsync handler is triggered.

In addition, we can put all the page code in a .cshtml file. For example, we can move these two functions from the ChangePassword.cshtml.cs file to ChangePassword.cshtml:

Keyword @ functions directive, which makes code within the scope of the Razor file a functional method.

Tag Helpers and HTML Helpers

We can also use all existing Tag Helpers and HTML Helpers; within the Razor page. In addition, we can create custom help classes and use them in the Razor page.

Routin

My small project setup in GitHub demonstrates how to use the Razor page for CRUD-repository links. You need .NET Core 2.0 preview 3 (build 6764 to function properly) or later and Visual Studio 2017.3 or later.

The following is the project structure of all files:

Everything is in the Pages folder except for the two standard files Program.cs and Startup.cs; note that some pages have matching background code files.

As mentioned earlier, the location of the pages in the project (the path in the file system) determines the matching URL.

Here is a list of important page files and routes that match:

Page file path matching URL~Pages/Index.cshtml/, / Index~Pages/Categories/Index.cshtml/Categories, Categories/Index~Pages/Categories/Edit.cshtml/Categories/Edit/1~Pages/Categories/Create.cshtml/Categories/Create so far, on the "how to create Razor pages in ASP.NET Core" learning is over, I hope to be able to solve your doubts. The collocation of theory and practice can better help you learn, go and try it! If you want to continue to learn more related knowledge, please continue to follow the website, the editor will continue to work hard to bring you more practical articles!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.