Blazor 怎么在页面之间传递数据

煙雲
发布: 2025-12-21 05:07:10
原创
736人浏览过
Blazor页面间传数据分三类:路由跳转用URL参数(如@page "/product/{id:int}"),组件嵌套用Parameter绑定,跨页面共享用状态管理(如Scoped服务、CascadingParameter);全C#实现,无需JS。

blazor 怎么在页面之间传递数据

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<string> TitleChanged { get; set; }</string>
  • 父组件调用:<productcard></productcard>,修改子组件内 Title 会自动同步回父组件
  • 注意:仅限直系父子;跨层级需靠 CascadingParameter 或服务

用服务(Scoped Service)实现跨页面状态共享

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

启明星企业抽奖程序1.0
启明星企业抽奖程序1.0

启明星企业抽奖程序 系统采用ASP.NET4.0 无需数据库。在企业抽奖时,请勿关闭或者刷新页面。因为系统目前没有提供保存数据功能。例如在抽二等奖和一等奖之间,可能有时间间隔。那么,此时,你可以按F11取消全屏,然后最小化页面,再单击右下角喇叭,设置无声。1.启明星抽奖程序配置说明使用说明:在lottery/lottery文件夹下,有3个文本文件。company.txt存放公司名称,award.t

启明星企业抽奖程序1.0 0
查看详情 启明星企业抽奖程序1.0
  • 注册一个 scoped 服务(如 AppState),里面放 public string SearchTerm { get; set; }public event Action OnChange;
  • Program.cs 注册:builder.Services.AddScoped<appstate>();</appstate>
  • 各页面通过 [Inject] AppState State { get; set; } 访问,改值后触发 State.OnChange?.Invoke(),订阅方用 State.OnChange += StateHasChanged; 响应
  • 更简洁可选 Microsoft.AspNetCore.Components.Forms.EditContext 或第三方如 Blazored.LocalStorage 持久化

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

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

  • 在根组件(如 App.razorMainLayout.razor)用 <cascadingvalue value="themeService">...</cascadingvalue> 包裹内容
  • 任意后代组件声明:[CascadingParameter] public ThemeService Theme { get; set; },无需注入即可使用
  • 注意:CascadingParameter 不自动响应变化,如需响应式,配合 EventCallbackNotifyStateChanged 手动刷新

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

以上就是Blazor 怎么在页面之间传递数据的详细内容,更多请关注php中文网其它相关文章!

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号