Blazor父子组件通信主要靠Parameter、EventCallback和CascadingParameter:父传子用[Parameter]接收属性并支持@bind双向绑定;子传父通过EventCallback回调;跨多层用CascadingParameter级联值;服务共享仅作特殊场景兜底。
Blazor 中父子组件通信主要靠参数传递(
、
)和
,不需要状态管理库也能高效协作。
父传子:用 [Parameter] 接收属性
子组件定义 public 属性并加
特性,父组件像写 HTML 属性一样传值:
子组件(Child.razor)中写:
[Parameter] public string Title { get; set; } = "默认标题";
父组件中使用:
,其中
是父组件的字段或属性
支持双向绑定:子组件加
和
,父组件用
即可同步更新
子传父:用 EventCallback 触发回调
这是最常用、最推荐的方式,本质是子组件“通知”父组件发生了什么:
子组件声明:
[Parameter] public EventCallbackOnSubmit { get; set; }
在子组件内部(如按钮点击)调用:
await OnSubmit.InvokeAsync("用户输入内容");
父组件接收:
,并在
中定义
注意:
支持泛型,可传任意类型(
、
等)
跨多层传递:用 Cas
cad
ingParameter
适合主题、语言、认证上下文等需要贯穿多层组件的场景:
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
如果你了解HTML,CSS和JavaScript,您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造,可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序,然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流,并开始构建应用程序,提供更
下载
顶层组件(如 MainLayout.razor)包裹内容:
@Body
任意后代组件声明:
[CascadingParameter] public MainLayout Layout { get; set; }
也可级联简单值:
...
,后代用
注意:级联值变化时,所有监听它的组件会自动重新渲染(需确保值是引用类型或重写
控制)
不推荐但可行:通过服务共享状态
适用于复杂交互或多个非父子关系组件需协同的场景,但要小心生命周期和线程安全:
注册一个 scoped 服务(如
),含
组件注入该服务,修改状态后触发事件,其他组件订阅并刷新 UI
Blazor Server 下注意 SignalR 连接上下文;WebAssembly 下无此限制,但仍建议优先用前三种方式
避免在服务里直接操作 DOM 或依赖页面生命周期,保持纯逻辑
基本上就这些。多数场景用
+
就够了,清晰、可控、易测试。CascadingParameter 是优雅的补充,服务共享则留作特殊需求兜底。
@bindEventCallbackCascadingParameter[Parameter]@parentTitle[Parameter] public string Value { get; set; }[Parameter] public EventCallback ValueChanged { get; set; } @bind-Value="model.Text"@codevoid HandleChildSubmit(string msg) { ... }EventCallbackEventCallbackEventCallback[CascadingParameter] public User currentUser { get; set; }ShouldRenderSharedStateServicepublic event Action OnStateChanged;[Parameter]EventCallback