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 }
这种优雅一点不难,只需要写一个扩展方法,把他放在任意地方并且导入命名空间,或者放到和项目同一个命名空间下
这种优雅一点不难,只需要写一个扩展方法,把他放在任意地方并且导入命名空间,或者放到和项目同一个命名空间下
blazor优雅的方式导入组件相关的js脚本的更多相关文章
- php如何优雅地把数组传递给前端js脚本?
比如说http://echarts.baidu.com/demo...这个例子中,一般里面的timeData数组都是数据库的所有记录的单独某一个列的集合,而例子中第149行的 data:[ 1,2,3 ...
- React组件导入的两种方式(动态导入组件的实现)
一. react组件两种导入方式 React组件可以通过两种方式导入另一个组件 import(常用) import component from './component' require const ...
- 如何优雅的设计React组件
如何优雅的设计 React 组件 如今的 web 前端已被 React.Vue 和 Angular 三分天下,一统江山十几年的 jQuery 显然已经很难满足现在的开发模式.那么,为什么大家会觉得 j ...
- Spring装配Bean的三种方式+导入和混合配置
目录 Spring IoC与bean 基于XML的显式装配 xml配置的基本结构 bean实例的三种创建方式 依赖注入的两种方式 构造器注入方式 setter方法注入方式 利用命名空间简化xml 基于 ...
- Blazor中的无状态组件
声明:本文将RenderFragment称之为组件DOM树或者是组件DOM节点,将*.razor称之为组件. 1. 什么是无状态组件 如果了解React,那就应该清楚,React中存在着一种组件,它只 ...
- 如何优雅的设计 React 组件
作者:晓冬 本文原创,转载请注明作者及出处 如今的 Web 前端已被 React.Vue 和 Angular 三分天下,一统江山十几年的 jQuery 显然已经很难满足现在的开发模式.那么,为什么大家 ...
- NX二次开发-基于MFC界面的NX对Excel读写操作(OLE方式(COM组件))
NX二次开发API里没有对EXCAL读写操作的相关函数,市面上有很多种方法去实现,比如UFUN调KF,ODBC,OLE(COM组件)等等.这里我是用的OLE(COM组件)方式去做的,这种在VC上创建的 ...
- React技巧之导入组件
正文从这开始~ 总览 在React中,从其他文件中导入组件: 从A文件中导出组件.比如说,export function Button() {} . 在B文件中导入组件.比如说,import {But ...
- 【目录】Newlife XCode组件相关文章目录
本博客所有文章分类的总目录链接:本博客博文总目录-实时更新 1.Newlife XCode组件相关文章目录 1.Newlife XCode组件资源目录汇总[2013年版] 2.Newlife ...
- 解决cxf+spring发布的webservice,types,portType和message以import方式导入
用cxf+spring发布了webservice,发现生成的wsdl的types,message和portType都以import的方式导入的.. 原因:命名空间问题 我想要生成的wsdl在同个文件中 ...
随机推荐
- KingbaseES V8R3数据库运维案例之---不完整的启动包(incomplete startup packet)复现
案例说明: 在KingbaseES V8R3数据库的sys_log日志中,出现以下故障信息"不完整的启动包(incomplete startup packet)"日志信息.本案例复 ...
- RSA进阶(一)
本篇为RSA进阶篇,继RSA入门 [RSA3]P1(扩展欧几里得) 题目 from Crypto.Util.number import * flag = b'******' m1 = bytes_to ...
- 哈希表(HashTable)
哈希表 哈希表:也叫做散列表.是根据关键字和值(Key-Value)直接进行访问的数据结构.也就是说,它通过关键字 key 和一个映射函数 Hash(key) 计算出对应的值 value,然后把键值对 ...
- #直径,线段树#51nod 1766 树上的最远点对
题目 多组询问,在 \([a,b]\) 和 \([c,d]\) 中分别选一个点 \(x,y\) ,使得 \(dis(x,y)\) 最大 分析 考虑直径的一个性质,两个点集两条直径的四个端点可能成为合并 ...
- Seaborn调色盘设置
调色盘设置 设置调色 color_palette()设置调色盘,返回一个调色盘的颜色列表,默认6种颜色:deep, muted, bright, pastel, dark, colorblind. s ...
- 教你构建一个优秀的SD Prompt
构建一个优秀的Prompt 在使用Stable Diffusion AI时,构建一个有效的提示(Prompt)是至关重要的第一步.这个过程涉及到创造性的尝试和对AI行为的理解.这里我会对如何构建一个好 ...
- .NET MAUI开源免费的UI工具包 - Uranium
前言 一直有小伙伴在微信公众号后台留言让我分享一下.NET MAUI相关的UI框架,今天大姚分享一个.NET MAUI开源.免费的UI工具包:Uranium. Uranium介绍 Uranium是一个 ...
- docker 应用篇————docker原理[三]
前文 前面就已经介绍了docker的安装,在https://www.cnblogs.com/aoximin/p/12906218.html,这里面,这里作为重新整理. 那么这里就不介绍了,这里直接是进 ...
- 面向切面编程AOP[一](java 代码详解)
前言 说句实话,在工作中,使用的aop不是特别多,但是特别重要,一般是辅助程序,在现代开发者辅助程序相当重要,比如说我们需要打印一些log,但是我们不可能去卸载我们的业务程序中,因为这太..... 正 ...
- setTimeout(fn, 0) // it works - JavaScript 事件循环 动画演示
在前端代码中很经常看到使用 setTimeout(fn, 0),如下面代码所示,乍一看很多余,但是移除了可能会出现一些奇奇怪怪的问题.要解释这个就需要理解 事件循环(Event Loop),下面会通过 ...