EKsumic's Blog

let today = new Beginning();

Click the left button to use the catalog.

OR

Blazor 元件之間的傳值方式極簡總結

Blazor 提供以下主要傳值方式:

  1. 父元件向子元件傳遞資料:使用 [Parameter] 定義參數。

    <ProductCard Product="product" />
  2. 子元件向父元件通知事件:使用 EventCallback

    <ProductCard OnProductSelected="HandleSelection" />
  3. 父子元件雙向資料綁定:使用 @bind 實現同步。

    <EditProductForm Product="@SelectedProduct" />
  4. 層級資料傳遞:使用 CascadingParameter 傳遞全域資料。

    <CascadingValue Value="CurrentUser">
        <UserProfile />
    </CascadingValue>
  5. 全域資料分享:使用相依性注入(DI)。

    @inject AppState AppState
    <p>@AppState.CurrentUser</p>

選擇適合的傳值方式,實現高效、清晰的元件通信!

This article was last edited at 2025-01-16 16:25:39

* *