前言

雖然說學習新的開發框架是一項巨大的投資，但是作為一個開發人員，不斷學習新的技術并快速上手是我們應該掌握的技能，甚至是一個.NET Framework開發人員，學習.NET Core 新框架可以更快速掌握其中的撰寫，構建，測驗，部署和維護應用程式，

您現有的.NET Framework應用程式可以在其他作業系統上作業，對于希望擴大類別庫的受眾平臺，或者希望在分布式應用程式的其他領域使用相同代碼的開發人員來說，這是非常好的選擇，

.NET Core是為了重新啟動某些Framework組件而為其他人提供跨平臺作業的機會，由于.NET Framework主要以托管（C＃）代碼為基礎構建，因此這些部分不需要更改代碼即可移至.NET Core，依賴于Windows特定組件的庫必須被移除或重構以使用跨平臺替代方案，這同樣適用于您的應用程式，

選擇學習.NET Core,是因為有強大的多功能性：

加上微軟社區的大量作業，使.Net Core成為市場上具有競爭力的框架，幫助開發人員快速開發具有最佳性能和可擴展性的強大應用程式，

在本章，我們將介紹生成 ASP.NET Core Razor Pages Web 應用的基礎知識，基于ASP.NET Core應用程式中的Razor視圖引擎，快速的搭建一個博主的管理系統應用，并且在后續中，我們可以基于這個模板進行快速開發迭代，

工具

本文基于以下開發工具和程式包：

1.VS2019

包含 ASP.NET Web開發功能模塊

2. .NET Core SDK 3.0版本

開始

一、創建新的 ASP.NET Core Web 應用程式

1. 下一步：

2.將專案命名為“BlogRazor” ，

3.選擇ASP.NET Core3.0 , 然后依次選擇“Web 應用程式”和“創建”

4.專案初建成功：

二、添加模型

1.添加資料模型

創建新檔案夾Models,在此檔案夾下右鍵選擇“添加” > “類” ，創建BloggerModel類

using System;
using System.Collections.Generic;
using System.ComponentModel.DataAnnotations;
using System.Linq;
using System.Threading.Tasks;

namespace BlogRazor.Models
{
    public class BloggerModel
    {
        public int ID { get; set; }

        public string Name { get; set; }
        public string Sex { get; set; }
        public string Sign { get; set; }
        [DataType(DataType.Date)]
        public DateTime RegistDate { get; set; }
    }
}

2. 添加模型基架

創建“Pages/Blogger”檔案夾——在Blogger檔案夾右鍵選擇添加新搭建基架的專案

3. 在“添加基架”對話框中，選擇“使用物體框架生成 Razor Pages (CRUD)”>“添加” ，

4 .完成“使用物體框架(CRUD)添加 Razor Pages”對話框：

在“模型類”下拉串列中，選擇“BloggerModel (BlogRazor.Models) ，
在“資料背景關系類”行中，選擇 +（加號）并將生成的名稱從 BlogRazor.Models .BlogRazorContext 更改為 BlogRazor.Data .Data.Context ，它創建具有正確命名空間的資料庫背景關系類，
選擇“添加” ，

4. 開始創建檔案，在搭建基架時，會創建并更新以下檔案

Pages/Blogger：“創建”、“洗掉”、“詳細資訊”、“編輯”和“索引”，
Data/BlogRazorContext.cs

5 . 資料初始遷移

通程序式包管理器控制臺 (PMC) ：

Add-Migration InitialCreate
Update-Database

三、測驗應用

說明

一、增刪查改頁面

這里已Blogger/Index.cshtml Razor頁面為例

@page
@model BlogRazor.Pages.Blogger.IndexModel

@{
    ViewData["Title"] = "Index";
}

<h1>Index</h1>

<p>
    <a asp-page="Create">Create New</a>
</p>
<table class="table">
    <thead>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.BloggerModel[0].Name)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.BloggerModel[0].Sex)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.BloggerModel[0].Sign)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.BloggerModel[0].RegistDate)
            </th>
            <th></th>
        </tr>
    </thead>
    <tbody>
@foreach (var item in Model.BloggerModel) {
        <tr>
            <td>
                @Html.DisplayFor(modelItem => item.Name)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Sex)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.Sign)
            </td>
            <td>
                @Html.DisplayFor(modelItem => item.RegistDate)
            </td>
            <td>
                <a asp-page="./Edit" asp-route-id="@item.ID">Edit</a> |
                <a asp-page="./Details" asp-route-id="@item.ID">Details</a> |
                <a asp-page="./Delete" asp-route-id="@item.ID">Delete</a>
            </td>
        </tr>
}
    </tbody>
</table>

    public class IndexModel : PageModel
    {
        private readonly BlogRazor.Models.Data.Context _context;

        public IndexModel(BlogRazor.Models.Data.Context context)
        {
            _context = context;
        }

        public IList<BloggerModel> BloggerModel { get;set; }

        public async Task OnGetAsync()
        {
            BloggerModel = await _context.BloggerModel.ToListAsync();
        }
    }

Razor 可以從 HTML 轉換為 C# 或 Razor 特定標記，當 @ 符號后跟 Razor 保留關鍵字時，它會轉換為 Razor 特定標記，否則會轉換為 C#，

@page 指令

@page Razor 指令將檔案轉換為一個 MVC 操作，這意味著它可以處理請求， @page 必須是頁面上的第一個 Razor 指令， @page 是轉換到 Razor 特定標記的一個示例，

@model 指令

@model 指令指定傳遞給 Razor 頁面的模型型別，在前面的示例中，@model 行使 PageModel 派生的類可用于 Razor 頁面，

@model BlogRazor.Pages.Blogger.IndexModel

ViewData 和布局

@{
    ViewData["Title"] = "Index";
}

上面的代碼就是 Razor 代碼轉換為 C# 的一個示例，大括號“{ }” 字符括住 C# 代碼塊，

PageModel 基類具有 ViewData 字典屬性，可用于添加要傳遞到某個視圖的資料，可以使用鍵/值模式將物件添加到 ViewData 字典，在上面的示例中，“Title”屬性被添加到 ViewData 字典中， “Title”屬性的在 Pages/_Layout.cshtml 檔案中使用，

"Title" 屬性用于 Pages/Shared/_Layout.cshtml 檔案，以下標記顯示 _Layout.cshtml 檔案的前幾行，

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - BlogRazor</title>
    <link rel="stylesheet" href=https://www.cnblogs.com/i3yuan/p/"~/lib/bootstrap/dist/css/bootstrap.min.css" />
    <link rel="stylesheet" href=https://www.cnblogs.com/i3yuan/p/"~/css/site.css" />
</head>

更新布局

1.更改 Pages/Shared/_Layout.cshtml 檔案中的 <title> 元素以顯示博主管理系統而不是 BlogRazor，

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>@ViewData["Title"] - 博主管理系統</title>