Blazor使用级联值实现Dialog关闭功能
思路
1.在模板页面增加CascadingValue传入Dialog的实例
2.在BaseComponent中加入[CascadingParameter]特性声明级联Dialog实例参数
3.在模块页面按钮方法中调用Dialog实例参数的Close方法
模板页面
<div class="app"> <CascadingValue Value="dialog"> <DynamicComponent Type="componentType" /> </CascadingValue> </div> <Dialog @ref="dialog" /> @code { private Dialog dialog; private Type componentType; }
BaseComponent
public class BaseComponent : ComponentBase, IDisposable { [CascadingParameter] protected Dialog Dialog { get; set; } }
模块页面
@inherits BaseComponent <div> <button @onclick="OnOpen">打开</button> </div> @code { private void OnOpen() { UI.Show(new DialogOption{ Title = "测试", Content = builder => { builder.Element("button", b => { b.Text("关闭").OnClick(EventCallback.Factory.Create(this, e => Dialog.Close())); }) } }); } }
Known 是基于 Blazor 轻量级、跨平台、低代码、易扩展的插件开发框架。
源码:https://gitee.com/known/Known
源码:https://github.com/known/Known
如果对您有帮助,点击⭐Star⭐关注 ,感谢支持开源!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!