Asp.NetCore Razor 模式 Web 應用

Razor 頁面是 ASP.NET Core MVC 的一個新功能,它能夠使基於頁面的編碼方式更簡單高效。html

Razor 頁面是 ASP.NET Core 2.0 中的一個新選擇,它是基於頁面的編程模型,能夠實現更簡單、更高效地生成 Web UImysql

安裝 .NET Core 2.0.0 或更高版本。web

若是在使用 Visual Studio,請使用如下工做負載安裝 Visual Studio 2017 版本 15.3 或更高版本:sql

 

1、 建立Razor項目編程

  1. 新建項目json

 

2. 選擇web應用程序,不是選擇空,這樣能夠查看默認的代碼結構。mvc

 

3. 代碼結構app

 

 2、 項目文件和文件夾async

   1. wwwroot :包含靜態文件。 請參閱使用靜態文件函數

   2. Pages: Razor Pages的文件夾。

   3. appsettings.json:配置文件

   4. Program.cs: 託管 ASP.NET Core 應用。

   5. Startup.cs:配置服務和請求管道。 請參閱啓動

 3、 添加數據模型

   

  Movie類:

    public class Movie
    {
        public int ID { get; set; }

        [Display(Name = "標題")]
        [StringLength(10, MinimumLength = 3)]
        public string Title { get; set; }

        [Display(Name = "發佈時間")]
        [DataType(DataType.Date)]
        public DateTime ReleaseDate { get; set; }

        [Display(Name = "類型")]
        public string Genre { get; set; }
        [Display(Name = "價格")]
        public decimal Price { get; set; }
    }
}

MovieContext類:(EF MySql Core)

    public class MovieContext : DbContext
    {
        public MovieContext(DbContextOptions<MovieContext> options)
                : base(options)
        {
        }
        public DbSet<Movie> Movie { get; set; }
    }

  appsettings.json

{
  "Logging": {
    "IncludeScopes": false,
    "LogLevel": {
      "Default": "Warning"
    }
  },
  "ConnectionStrings": {
    "MovieContext": "Data Source=;Database=;uid=root;pwd=;port=3306;SslMode=none;Convert Zero Datetime=true;persist security info=true;charset=utf8;Pooling=true;"
  }
}

Startup類:(默認依賴注入)

這裏須要在NuGet中下載mysql core 包 MySql.Data.EntityFrameworkCore

 

        // This method gets called by the runtime. Use this method to add services to the container.
        public void ConfigureServices(IServiceCollection services)
        {
            services.AddDbContext<MovieContext>(options =>
      options.UseMySQL(Configuration.GetConnectionString("MovieContext")));
            services.AddMvc();
        }

 

4、實現增,刪,改,查

Razor 頁面派生自 PageModel。 按照約定,PageModel 派生的類稱爲 <PageName>Model。 此構造函數使用 依賴關係注入將 MovieContext 添加到頁。
Movie 屬性使用 [BindProperty] 特性來選擇加入 模型綁定。 當「建立」表單發佈表單值時,ASP.NET Core 運行時將發佈的值綁定到 Movie 模型。當頁面發佈表單數據時

     

 

  1. 對頁面發出請求時,OnGetAsync 方法向 Razor 頁面返回影片列表。 在 Razor 頁面上調用 OnGetAsync 或 OnGet 以初始化頁面狀態。 在這種狀況下,OnGetAsync 將得到影片列表並顯示出來。

  2. 當 OnGet 返回 void 或 OnGetAsync 返回 Task 時,不使用任何返回方法。

 

  3.  當返回類型是 IActionResult 或 Task<IActionResult> 時,必須提供返回語句。

 

 

   cs:

    public class CreateModel : PageModel
    {
        private readonly MovieContext _context;
        public CreateModel(MovieContext context)
        {
            _context = context;
        }

        public IActionResult OnGet()
        {
            return Page();
        }

        [BindProperty]
        public WebApp_Razor.Models.Movie Movie { get; set; }
        public async Task<IActionResult> OnPostAsync()
        {
            if (!ModelState.IsValid)
            {
                return Page();
            }
            _context.Movie.Add(Movie);
            await _context.SaveChangesAsync();
            return RedirectToPage("./Index");
        }
    }

  html:

@page
@model CreateModel
@{
    ViewData["Title"] = "Create";
}

<h2>Create</h2>
<h4>Movie</h4>
<hr />
<div class="row">
    <div class="col-md-4">
        <form method="post">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Movie.Title" class="control-label"></label>
                <input asp-for="Movie.Title" class="form-control" />
                <span asp-validation-for="Movie.Title" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Movie.ReleaseDate" class="control-label"></label>
                <input asp-for="Movie.ReleaseDate" class="form-control" />
                <span asp-validation-for="Movie.ReleaseDate" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Movie.Genre" class="control-label"></label>
                <input asp-for="Movie.Genre" class="form-control" />
                <span asp-validation-for="Movie.Genre" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Movie.Price" class="control-label"></label>
                <input asp-for="Movie.Price" class="form-control" />
                <span asp-validation-for="Movie.Price" class="text-danger"></span>
            </div>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </form>
    </div>
</div>

<div>
    <a asp-page="Index">Back to List</a>
</div>

@section Scripts {
    
    @{
         await Html.RenderPartialAsync("_ValidationScriptsPartial");
    }
}

 

   

相關文章
相關標籤/搜索