作为一名Web开发人员,开发前端少不了使用JavaScript,而Blazor就是微软推出的基于.net平台交互式客户 Web UI 框架,可以使用C#替代JavaScript,减少我们的技术栈、降低学习前端的成本。

而采用Blazor开发,少不了需要封装UI控件,所以今天给大家推荐一套基于TDesign风格的Blazor企业级UI组件库。

项目简介

这是一套基于 TDesign 的 Blazor 企业级组件库,TDesign是腾讯内部经过多年提炼总结的,其UI漂亮、通用性较强,使用该框架,可以避免我们重复造轮子,帮助我们快速的完成项目的开发与交付。

项目特性

1、支持.Net 6、.Net 7;

2、使用C#开发,可以直接调用.Net丰富的类库;

3、基于TDesign风格,UI效果、交互体验都是非常好的;

4、可以与.Net MFC、Razor无缝的对接;

5、支持主流的浏览器,IE只支持11+的版本,而且只支持服务端模式。

项目结构

文档项目

ServerSide服务端模式、WebAssembly客户端模式。

使用方法

引入必要的样式、Js文件

App.razor:增加组件

部分UI组件效果

按钮风格

表单风格

选项卡

菜单导航

分页

表格

提示框

对话框

消息通知

项目地址

https://github.com/AchievedOwner/TDesignBlazor

更多开源项目请查看一个专注推荐优秀.Net开源项目的榜单

- End -

文章首发于公众号【编程乐趣】,欢迎大家关注。

基于TDesign风格的Blazor企业级UI组件库的更多相关文章

  1. [转载]前端——实用UI组件库

    https://www.cnblogs.com/xuepei/p/7920888.html Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https:/ ...

  2. 强烈推荐优秀的Vue UI组件库

    Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基于Vue的UI组件框架开发,并投入正 ...

  3. 【转】优秀的Vue UI组件库

    原文来源:https://www.leixuesong.com/3342 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司 ...

  4. 16款优秀的Vue UI组件库推荐

    16款优秀的Vue UI组件库推荐 Vue 是一个轻巧.高性能.可组件化的MVVM库,API简洁明了,上手快.从Vue推出以来,得到众多Web开发者的认可.在公司的Web前端项目开发中,多个项目采用基 ...

  5. ui组件库

    基于Vue的Quasar Framework 中文网 http://www.quasarchs.com/ quasarframework/quasar: Quasar Frameworkhttps:/ ...

  6. Blazor组件提交全记录: FullScreen 全屏按钮/全屏服务 (BootstrapBlazor - Bootstrap 风格的 Blazor UI 组件库)

    Blazor 简介 Blazor 是一个使用 .NET 生成的交互式客户端 Web UI 的框架.和前端同学所熟知的 Vue.React.Angular 有巨大差异. 其最大的特色是使用 C# 代码( ...

  7. 基于Svelte3.x桌面端UI组件库Svelte UI

    Svelte-UI,一套基于svelte.js开发的桌面pc端ui组件库 最近一直忙于写svelte-ui,一套svelte3开发的桌面端ui组件库.在设计及功能上借鉴了element-ui组件库.所 ...

  8. 基于Vue的前端UI组件库的比对和选型

    大家好,我是张飞洪,感谢您的阅读,我会不定期和你分享学习心得,希望我的文章能成为你成长路上的垫脚石,让我们一起精进. 由于录制视频的需要,要做前端UI组件库的选型.平时国内外也见了不少基于Vue的UI ...

  9. 【转】前端——实用UI组件库

    Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https://valor-software.com/ngx-bootstrap/#/ github: h ...

  10. 前端——实用UI组件库

    Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https://valor-software.com/ngx-bootstrap/#/ github: h ...

随机推荐

  1. window 安装淘宝镜像

    打开cmd, 输入如下命令 npm config set registry https://registry.npm.taobao.org 判断是否配置淘宝镜像成功 npm config get re ...

  2. Alfred 好用工具分享

    好用的mac工具分享 1.带历史记录的剪切板 根据快捷键切换选择保存的数据 2.创建热键工作流程 将常用的工具变为热键,快捷切换 如何创建: 设置热键 单击右键 创建actions 打开app 然后将 ...

  3. 杭电OJ--1048-C++实现

    #include <iostream>#include<vector>#include<string>#include<cctype>#include& ...

  4. HTTP和HTTPS的定义和区别

    http是什么? 超文本传输协议(Hyper Text Transfer Protocol,HTTP)是一个简单的请求-响应协议,它通常运行在TCP之上.它指定了客户端可能发送给服务器什么样的消息以及 ...

  5. Java基础Day7-值传递和引用传递

    一.值传递 Java都是值传递. 值传递:是指在调用函数时,将实际参数复制一份传递到函数中,这样在函数中如果对参数进行修改,就不会影响到实际参数. 值传递是对基本数据类型而言. 二.引用传递 引用传递 ...

  6. 2月26日Android开发学习

    1.App运行日志 Android采用Log工具打印日志,他讲各类日志划分为五个等级 (1)Log.e:表示错误信息,比如可能导致程序崩溃的异常. (2)Log.w:表示警告信息. (3)Log.i: ...

  7. js 数组对象中每一项对象属性比较大小与计算数组对象属性和

    // 数组对象排序方法   export function compare(property) {       return function (a, b) {         const value ...

  8. c++官方网站汇集

    c++官方网站汇集 gcc官网: https://gcc.gnu.org/ c++参考手册: https://en.cppreference.com/w/cpp c++教程网站: https://ww ...

  9. PVE设置定时关闭、启动虚拟机

    shell中输入命令: crontab -e 进入对应cron 添加命令: 例如: 00 2 * * * pvesh create /nodes/pve/qemu/102/status/stop 00 ...

  10. Cortex-M内核指令WFI和WFI

    背景 今天阅读Nordic SDK里的example时发现里面功耗管理使用的power_manage()函数主要就是调用了一个__WFE()函数.查阅资料了解到WFE是一条汇编指令,它可以让CPU内核 ...