當麻許的碎念筆記

最近在做一些專案轉移，遇到以前的 .NET Framework 的 WebForm  轉到新的 .NET 8 上面

在 .NET Razor Pages 中，Partial Layout 是一種可以分離頁面佈局和邏輯的方法，

允將重複的 Layout 部分抽取到一個單獨的文件中，並根據需要載入不同的資料。這種方式不僅提升了代碼的重用性和可維護性，還使得頁面更加模組化和靈活。

有點類似以前 Web Component 的作法，但是不會有 Postback 的麻煩問題，筆記一下

1.  首先我在 Shared 下開一個 LayoutTest1.cshtml 內容如下

程式碼如下:

@model List<string> <ul> @foreach (var item in Model) { <li>@item</li> } </ul>

2. 在 Page 中引入的部份

.cshtml 

@page @model ProjectName.Pages.cp.labModel @{ Layout = null; } <partial name="~/Pages/Shared/LayoutTest1.cshtml" model="Model.Cates" />

.cshtml.cs

using Microsoft.AspNetCore.Mvc; using Microsoft.AspNetCore.Mvc.RazorPages; namespace ProjectName.Pages.cp { public class labModel : PageModel { public List<string> Cates { get; set; } public void OnGet() { Cates = new List<string>(); Cates.Add("分類1"); Cates.Add("分類2"); Cates.Add("分類3"); } } }

基本上，頗簡單的為何會特別寫一篇，之前發現竟然有朋友不知道有這東西，重複貼上一樣的東西

所以乾脆寫一篇，如果不需要動態放入資料期時該 Partial Layout 也可以直接去 render 一個 static 的 List 也行

@using System.Globalization &lt;div class=&quot;sidebar&quot;&gt; &lt;h3&gt;Recent Posts&lt;/h3&gt; &lt;div class=&quot;boder-bar&quot;&gt;&lt;/div&gt; &lt;ul class=&quot;recent-post&quot;&gt; @foreach(var c in StaticCache.Top3Articles) { &lt;li&gt; &lt;img alt=&quot;recent-posts-img&quot; src=&quot;@c.P2&quot;&gt; &lt;div&gt; &lt;span&gt;@Html.Raw(c.Stamp.ToString(&quot;MMMM dd,yyyy&quot;, CultureInfo.GetCultureInfo(&quot;en-US&quot;)))&lt;/span&gt; &lt;a href=&quot;/Post?id=@c.Id&quot;&gt;@c.Display&lt;/a&gt; &lt;/div&gt; &lt;/li&gt; } &lt;/ul&gt; &lt;/div&gt;

筆記先到這裡..

reference:

https://learn.microsoft.com/zh-tw/aspnet/core/mvc/views/partial?view=aspnetcore-8.0