17370845950

Blazor页面间传数据分三类：路由跳转用URL参数（如@page "/product/{id:int}"），组件嵌套用Parameter绑定，跨页面共享用状态管理（如Scoped服务、CascadingParameter）；全C#实现，无需JS。

Blazor 页面间传数据，核心看场景：路由跳转用 URL 参数，组件嵌套用 参数绑定，跨页面/跨组件共享用 状态管理（如 Cas#%#$#%@%@%$#%$#%#%#$%@_b5fde512c76571c8afd6a6089eaaf42aingParameter、服务注入或第三方库）。不依赖 JS，全 C# 驱动。

用 NavigationManager 带参数跳转（推荐给简单值）

适合传递 ID、名称等轻量、可序列化的值。本质是拼 query string 或使用路由模板参数。

• 定义带参数的路由，比如：@page "/product/{id:int}"，然后在组件里用 [Parameter] public int Id { get; set; } 接收
• 跳转时用 NavigationManager.NavigateTo("/product/123")，框架自动解析并赋值
• 想传多个或非路由参数？用 query string：NavigationManager.NavigateTo("/search?keyword=blazor&sort=date")，再用 Microsoft.AspNetCore.WebUtilities.QueryHelpers.ParseQuery 解析

用组件参数（@bind / [Parameter]）父子传值

不是“页面之间”，而是父组件渲染子组件时直接传——适合布局页、弹窗、表单等嵌套结构。

• 子组件声明：[Parameter] public string Title { get; set; }，支持双向绑定加 [Parameter] public EventCallback TitleChanged { get; set; }
• 父组件调用：，修改子组件内 Title 会自动同步回父组件
• 注意：仅限直系父子；跨层级需靠 CascadingParameter 或服务

用服务（Scoped Service）实现跨页面状态共享

适合登录态、用户偏好、筛选条件等需要在多个页面间保持一致的数据。

• 注册一个 scoped 服务（如 AppState），里面放 public string SearchTerm { get; set; } 和 public event Action OnChange;
• 在 Program.cs 注册：builder.Services.AddScoped();
• 各页面通过 [Inject] AppState State { get; set; } 访问，改值后触发 State.OnChange?.Invoke()，订阅方用 State.OnChange += StateHasChanged; 响应
• 更简洁可选 Microsoft.AspNetCore.Components.Forms.EditContext 或第三方如 Blazored.LocalStorage 持久化

用 CascadingParameter 实现“上下文式”透传

适合主题、语言、权限等全局但不频繁变更的配置，避免层层手动传参。

• 在根组件（如 App.razor 或 MainLayout.razor）用 ... 包裹内容
• 任意后代组件声明：[CascadingParameter] public ThemeService Theme { get; set; }，无需注入即可使用
• 注意：CascadingParameter 不自动响应变化，如需响应式，配合 EventCallback 或 NotifyStateChanged 手动刷新

基本上就这些。小项目用路由参数+服务就够了；中大型建议封装状态服务 + 可选引入 Fluxor 或 MudBlazor 的 StateContainer 管理复杂状态。关键不是“怎么传”，而是“谁该持有这份数据”——把状态放在最合适的生命周期层级里，比技巧更重要。