Layout view ASP.NET MVC là gì?

Một ứng dụng website có thể chứa các phần chung trong các giao diện người dùng mà vẫn giữ nguyên trong suốt ứng dụng chẳng hạn như logo, tiêu đề, thanh điều hướng bên trái,thanh điều hướng bên phải hoặc phần footer.

ASP.NET MVC giới thiệu Layout View là một site template, có thể được thừa kế trong nhiều View để cung cấp một giao diện nhất quán trong nhiều trang của một site, trong đó có những phần giao diện chung và phần giao diện riêng cho từng view. Layout View giống như master page của ứng dụng ASP.NET Webform.
Ví dụ, một giao diện người dùng có thể chứa header, thanh menu trái, thanh menu phải và phần chân trang mà vẫn giống nhau trong tất cả các trang và chỉ có phần trung tâm thay đổi tự động theo từng trang trong website như hình dưới đây.

layout-view-asp-net-mvc

File Layout view trong ASP.NET MVC có cùng phần mở với các view khác như, .cshtml hoặc .vbhtml. Layout view được chia sẻ với nhiều view khác, vì vậy file Layout view phải được lưu trong thư mục Shared.

Khi tạo ứng dụng ASP.NET MVC, mặc định tạo file layout là _layout.cshtml trong thư mục Shared.

Ví dụ: _layout.cshtml

Layout View giống với view khác, chỉ khác Layout view gọi hai phương thức @RenderBody() và @RenderSection().

RenderBody hoạt động như một trình giữ chỗ cho các view khác. Ví dụ, view Index.cshtml trong thư mục Home sẽ được thêm vào và tạo ra trên layout view, tại vị trí phương thức RenderBody() được gọi.

Sử dụng Layout View trong ASP.NET MVC

Chúng ta có thể thiết lập các layout view theo nhiều cách, bằng cách sử dụng file _ViewStart.cshtml hoặc thiết lập đường dẫn của layout page sử dụng thuộc tính Layout trong từng view hoặc xác định tên layout view trong phương thức action.

_ViewStart.cshtml

File _ViewStart.cshtml mặc định nằm trong thư mục Views. Nó thiết lập các trang layout mặc định cho tất cả các view trong các thư mục và thư mục con của ứng dụng ASP.NET MVC bằng cách sử dụng thuộc tính Layout. Chúng ta có thể gán một đường dẫn hợp lệ của bất kỳ trang Layout sử dụng thuộc tính Layout.

Ví dụ, _ViewStart.cshtml trong thư mục Views, thiết lập thuộc tính Layout là “~/Views/Shared/_Layout.cshtml”.

@{

Layout = “~/Views/Shared/_Layout.cshtml”;

}

Vì vậy, file  _layout.cshtml sẽ là layout view của tất cả các view có trong thư mục Views và thư mục con của Views trong ứng dụng ASP.NET MVC.

Thiết lập Layout View ASP.NET MVC cho riêng từng trang

Chúng ta cũng có thể ghi đè thiết lập layout mặc định được thiết lập bởi file _ViewStart.cshtml bằng cách thiết lập thuộc tính Layout trong từng view .cshtml.

Ví dụ, view Index sau sử dụng file layout _myLayoutPage.cshtml thậm chí nếu _ViewStart.cshtml thiết _Layout.cshtml.

@{

ViewBag.Title = “Home Page”;

Layout = “~/Views/Shared/_myLayoutPage.cshtml”;

}

Xác định page Layout trong phương thức ActionResult

Chúng ta cũng có thể chỉ định page Layout cho view từ phương thức  ActionResult trong controller ASP.NET MVC.
Ví dụ, phương thức View() tạo view Index sử dụng _myLayoutPage.cshtml.


public class HomeController : Controller{
    public ActionResult Index(){
        return View("Index", "_myLayoutPage");
    }
}
Phương thức render

Layout view ASP.NET MVC tạo các view con bằng cách sử dụng các phương thức sau đây:

  • RenderBody() Phương thức tạo một phần của view con không xác định tên của phần được tạo. Layout view phải bao gồm phương thứcRenderBody().
  • RenderSection(string name) Phương thức tạo nội dung của phần được đặt tên và xác định xem phần này là có bắt buộc không. RenderSection() là tùy chọn trong Layout view.
Đánh giá của bạn

Add Comment