初識 Blazor WebAssembly 2（分割 .razor 文件，分為html&c#兩個文件）

緊接上文，我們定義一個 test.razor文件

@page "/test"
@* 路由 *@

<h2>Test Componet</h2>
<p> This is My Test Component </p>
@* html寫這 *@

@code {

    @* c#寫這 *@

}

然後我們將此文件分解成兩個文件 test.razor 和 test.razor.cs

1.test.razor 存放html語法

@page "/test"
@* 路由 *@

<h2>Test Componet</h2>
<p> This is My Test Component </p>
@* html寫這 *@

2.新建一個 test.razor.cs 文件，存放c#語法，即將原文件的 @code 部分copy過來

在 test.razor.cs 中加入 namespace 和 class

using Microsoft.AspNetCore.Components;
//使用using引入相關資源
// 父子傳遞需要引入此
namespace BlazorApp.Pages.Test
//表示此檔案在BlazorApp專案資料夾
//裡面的Pages資料夾裡面的Test資料夾裡

{
  public partial class Test
  {
    // c#寫這
  }
}

注：nampespace命名錯誤會導致兩個檔案無法互相參考