blazor优雅的方式导入组件相关的js脚本

基本的组件导入方式为：

1 await JsRuntime.InvokeVoidAsync("import", $"XXXXX.js");

优雅的组件导入方式：

1 await JsRuntime.ImportAsync<DocEditor>();

这种优雅一点不难，只需要写一个扩展方法，把他放在任意地方并且导入命名空间，或者放到和项目同一个命名空间下：

复制代码
 1 public static ValueTask ImportAsync(this IJSRuntime js, string path)
 2 {
 3     return js.InvokeVoidAsync("import", path);
 4 }
 5 public static ValueTask ImportAsync<Component>(this IJSRuntime js) where Component : ComponentBase
 6 {
 7     var nm = typeof(Component).Name;
 8     var fnm = typeof(Component).FullName!;//获取包含完整命名空间的名称
 9     var sns = fnm.Split('.', StringSplitOptions.RemoveEmptyEntries);
10     sns = sns.SkipWhile(x => x != "Components").TakeWhile(x => x != nm).ToArray();
11     return js.InvokeVoidAsync("import", $"/{string.Join('/', sns)}/{nm}.razor.js");
12 }
复制代码

这种优雅一点不难，只需要写一个扩展方法，把他放在任意地方并且导入命名空间，或者放到和项目同一个命名空间下

这种优雅一点不难，只需要写一个扩展方法，把他放在任意地方并且导入命名空间，或者放到和项目同一个命名空间下

 

posted @   宅猫君  阅读(198)  评论(0)  编辑  收藏  举报
相关博文：
· 一些简单的Post方式WebApi接收参数和传递参数的方法及总结
· blazor中的PageTitle输出keywords和description，自定义组件
· BootstrapBlazor组件库，更优雅的调用js方法
· 学Blazor 认识Blazor
· Blazor 引入CSS
阅读排行：
· 阿里最新开源QwQ-32B，效果媲美deepseek-r1满血版，部署成本又又又降低了！
· 单线程的Redis速度为什么快？
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决：字节Trae VS Cursor，谁才是开发者新宠？
· 展开说说关于C#中ORM框架的用法！
历史上的今天：
2021-05-07 Android Studio自强迫升级到4.2版本后调试Native项目时总是卡死问题
点击右上角即可分享
微信分享提示