开源 一套 Blazor Server 端精致套件

Blazor 作为一种 Web 开发的新技术已经发展有一段时间了,有些人标称 无 JS 无 TS,我觉得有点误导新人的意味,也有人文章大肆宣传 Blazor 是 JavaScript 的终结者,是为了替代 JavaScript 而生的,我认为这些言论都太激进了太片面了。我对 Blazor 的理解是:

它仅仅是为开发人员开发 Web 应用是多了一种选择,多了一条路而已,使用 Blazor 组件可以远离 Javascript 与 css,开发 Blazor 组件还是不能彻底抛弃 Javascript 与 css

本人在码云开源了一个 后台通用权限管理平台 BootstrapAdmin -,一直想把这个平台实现一个 SPA 的版本,随着 Blazor 的兴起,我个人想尝试使用 Blazor Server 端方式实现,由于一直比较喜欢 Eleme UI 的风格,于是在网上找了一下能满足需要的组件,要么是不好看,要么功能不全,比如 Table 组件展示一下数据可以,但是做到增删改查还差的很远很远。作为一个代码洁癖的人最不能接受是代码拿下来编译一下,几百个警告信息,眼泪立马流了下来。刚好 4 月份时间比较空闲,觉得利用一个月的时间自己写一套组件,由于出发点是想给 后台通用权限管理平台 BootstrapAdmin 使用,所以就叫了 BootstrapBlazor 这个名字。经过一个月时间的打磨,本套组件库已经基本完成,从简单的 button 组件到复杂的具备增删改查功能的 table 组件都可以正常使用了,虽然名字叫做 BootstrapBlazor,其实很多组件都是借鉴的 Eleme UI 跟 Ant Design 的,基本上组件都是自己手写 css 样式进行细致调整的。

Table 组件介绍

Table 组件是一个非常核心的组件,做好 Table 组件才能有核心竞争力,所以本人做了一个最强 Table 功能,一个 Table 组件完成一个单表维护,详情请看最后一个功能。

功能

  • 默认样式无边框

  • 斑马纹表格

  • 边框表格

  • 自带选择列表格

  • 强类型数据绑定

  • 分页表格

  • 自带 Toolbar 表格

  • 自带查询表格

  • 固定表头表格

  • 具备单表维护能力的表格

UI

通过上图可以看到 Table 头部左侧我放置了常用的操作按钮,负责 增加、删除、编辑 ;头部右侧放置了 搜索、刷新 等操作按钮;Table 内行也提供了 删除、编辑 快捷按钮;Table 底部是 分页 明细数据;组件采用前后端分离设计,开发人员只负责对数据的过滤操作即可。由于篇幅所限不做过多描述,各种功能请移步 演示地址 进行体验。

现将本套组件开源,诚心邀请各位大佬前来围观,并且帮忙点个 star

Gitee   地址为:https://gitee.com/LongbowEnterprise/BootstrapBlazor
Github 地址为:https://github.com/ArgoZhang/BootstrapBlazor

演示地址

http://blazor.sdgxgz.com/tables

非常期待 5 月 19 号的 Blazor wasm 正式版,由于之前一直不是正式版,所以本套组件也没有支持,等正式版出来后第一时间兼容 wasm 版

友情链接:

Ant.Design Blazor: http://github.com/ant-design-blazor/ant-design-blazor 演示地址: http://ant-design-blazor.gitee.io

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/310173.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

[Java基础]函数式接口

代码如下: package MyInterfacePack01;FunctionalInterface public interface MyInterface {void show(); }package MyInterfacePack01;public class MyInterfaceDemo {public static void main(String[] args){MyInterface my ()->System.out.println("hello world&q…

mysql单库用户隔离_Mysql数据库隔离级别

数据库事务四大特性(ACID)原子性(Atomicity)原子性是指事务中的操作要么全部成功,要么失败回滚。一致性(Consistency)一致性是指事务必须使数据库从一个一致性状态变换到另一个一致性状态,也就是说一个事务执行之前和执行之后都必须处于一致性状态。拿转…

Tree Cutting POJ - 2378(树形DP)

题意:有n个谷仓有n-1条路连接,问最少删除哪几个点才能使得删除点后得到的连通图的加点数不大于n/2. 分析:求树的重心的变形题,poj3107的简单版,一遍dfs从叶子到根转移找出找到以每个节点为根的子树的结点数&#xff0…

从零搭建分布式文件系统MinIO比FastDFS要更合适

前两天跟大家分享了一篇关于如何利用FastDFS组件来自建分布式文件系统的文章,有兴趣的朋友可以阅读下《用asp.net core结合fastdfs打造分布式文件存储系统》。通过留言发现大家虽然感兴趣,但是都觉得部署比较麻烦。的确,fastdfs的部署很繁琐&…

ember.js mysql_用AWS部署ember.jspadrino应用系列之一

aws提供了一年免费试用服务。这里,记录下,配置aws和部署开源cms程序——维卡币操盘手的整个过程。主要内容包括:EC2实例的创建和设置——ruby环境和nginx配置,部署ruby应用。RDS实例的创建和使用——mysql数据库参数组的使用。S3库…

[Java基础]方法引用

代码如下: package PrintablePack;public interface Printable {void printString(String s);}package PrintablePack;public class PrintableDemo {public static void main(String[] args){usePrintable(s-> System.out.println(s));usePrintable(System.out::println);/…

Maximum Sum UVA - 108(连续子序列最大和—变形之子矩阵最大和)

题目大意:给出 n*n 的矩阵,找每隔数字之和最大的子矩阵,输出最大和。 解题思路:枚举矩阵左上和右下的坐标,分别合并子矩阵的每列,使得二维转化为一维,然后利用连续子序列最大和去做就行。 Tim…

甲方爸爸,大概你要的是代码生成器吧?

作者:邹溪源,长沙资深互联网从业者,架构师社区特邀嘉宾!一1)有一天,我的朋友Y童鞋分享了他正在做的一个内部开源项目,这个开源项目从外表上看,跟目前市场上那些代码生成器本没有特别…

使用pdf.js来预览pdf文件_适用于Dynamics365与PowerApps的注释预览组件

powerapps/dynamics365适用的注释预览/批量下载组件自定义组件为预览功能原生预览支持的文件类型:图像,zip,音频,pdf支持批量打包注释为zip下载到本地使用浏览器预览支持:音频,视频,图像,pdf,文本,xml,json等,理论上只需要浏览器支持打开的文件类型,均可预览使用方法:1.导入解决…

[PAT乙级]1001 害死人不偿命的(3n+1)猜想

卡拉兹(Callatz)猜想: 对任何一个正整数 n,如果它是偶数,那么把它砍掉一半;如果它是奇数,那么把 (3n1) 砍掉一半。这样一直反复砍下去,最后一定在某一步得到 n1。卡拉兹在 1950 年的世界数学家大会上公布了…

Sticks UVA - 307(切木棍 线性区间dp,线性dp,区间思想。)

题目大意:将n节木棒接成m个长度相等的木条,要求木条的长度尽可能的短 Time limit 3000 ms OS Linux George took sticks of the same length and cut them randomly until all parts became at most 50 units long. Now he wants to return st…

消息队列,我只选RabbitMQ!

高并发架构是架构师的必修课,而消息队列,则是王冠上最闪亮的那颗明珠!能否驾驭消息队列这款高并发神器,亦成为架构师的试金石。作为专注.NET领域十多年的老架构师,下面从队列本质、技术选型、实战应用三个方面&#xf…

python比较三个数_python经典练习题(三)

人生苦短,你需要python继续学习python第一题题目:输入三个整数 x,y,z,请把这三个数由小到大输出不借助sortnum1 int(input("请输入第一个数"))num2 int(input("请输入第二个数"))num3 int(input("请输入第三个数&qu…

[PAT乙级]1002 写出这个数

读入一个正整数 n,计算其各位数字之和,用汉语拼音写出和的每一位数字。 输入格式: 每个测试输入包含 1 个测试用例,即给出自然数 n 的值。这里保证 n 小于 10​100​​。 输出格式: 在一行内输出 n 的各位数字之和的…

ROADS POJ - 1724(限制条件的最短路)【邻接表+深搜】

思路:先说下题意,题意第一行给了一个k,代表你有k的钱数,下一行有一个n,代表n个点,然后一个m,代表m条边,然后接下来m行,每行有四个数,分别代表起点、终点、路径长度和要花费的钱数,题…

使用Jexus 容器化您的 Blazor 应用程序

在本文中,我们将介绍如何将 Blazor 应用程序放入Jexus 容器以进行开发和部署。我们将使用 .NET Core CLI,因此无论平台如何,使用的命令都将是相同的。Blazor 托管模型Blazor 有两个托管模型,它们的要求不同,本文主要基…

mysql中临时修改参数用什么关键字_postgresql 中的参数查看和修改方式

1.查看参数文件的位置使用show 命令查看,比较常用的show config_file.此还可以查看pg_settings数据字典.test# show config_file;config_file------------------------------/data/pgdata/postgresql.conf(1 row)test# show hba_filetest-# ;hba_file-------------------------…

[PAT乙级]1004 成绩排名

读入 n(>0)名学生的姓名、学号、成绩,分别输出成绩最高和成绩最低学生的姓名和学号。 输入格式: 每个测试输入包含 1 个测试用例,格式为 第 1 行:正整数 n 第 2 行:第 1 个学生的姓名 学号…

圆桌会议 HDU - 1214(规律+模拟队列)

Time limit 1000 ms Memory limit 32768 kB OS Windows Source 杭电ACM省赛集训队选拔赛之热身赛 HDU ACM集训队的队员在暑假集训时经常要讨论自己在做题中遇到的问题.每当面临自己解决不了的问题时,他们就会围坐在一张圆形的桌子旁进行交流,经过大家的讨论…

【A】 Natasha3.0 引擎亮给你,请你来折腾

文章转载授权级别:A一 、 引言Natasha 距离上个 2. 版本大概有1个月了,在4月份里我把模板与引擎进行了重构,旨在更抽象、规范、合理,方便其他人参与开源、定制。接下来我将从 引擎的结构 、类库的使用及新热的 Source Generators …