Blazor
文章平均质量分 66
北音执念~
这个作者很懒,什么都没留下…
展开
-
Blzaor的Wasm和Server模式无缝切换,混合使用
这次实现了Wasm和Server无缝切换,并且去掉了Wasm首次加载时间过长的问题,利用Server先进行访问,等后台资源下载完成后,切换到Wasm模式,减少占用服务器资源和长连接的问题,wasm和server模式的混合使用...原创 2022-01-06 19:04:55 · 2522 阅读 · 0 评论 -
Ant Design Blazor Icon图标错位问题
在项目过程中发现icon有很严重的错位问题,但是看官网并没有发生错位,猜测应该是其他css引起的,先检查一下是否引用了其他css,我这里是因为没有删除bootstrap.min.css引起的原创 2021-04-30 14:35:00 · 666 阅读 · 0 评论 -
Blazor + Ant Design + .NET 5快速开发框架(8)Ant Design Icon图标库
前言icon可以使网站一目了然,在网站中假如一个可以直接选择图标的blazor组件,由于Ant Design没提供可以直接显示图标的组件,这里打算自己弄一个,方式是把所有的icon名称拷贝下来,然后遍历显示就可以。爬网站我的用方式简单粗暴,直接ctrl+s把页面保存下来,然后利用正则提取。正则表达式:<span class=\"ant-badge\" id=\"(.*?)\" _bl_(.*?)=\"\">(.*?)</span>亲测好用,一共是420个图标,以后原创 2021-04-23 16:07:08 · 1624 阅读 · 0 评论 -
Blazor + Ant Design + .NET 5快速开发框架(7) webApi设计思路
前言虽然一直在更新代码,但是文章写的比较少了,因为一直再写webApi,涉及到图片可能比较少,而且一直再改,因为我也不太确定用哪种方法或者设计模式是最好的,个人定义是使用方便,快速开发,所以摒弃了很多复杂设计,用最简单但不简陋的方法设计出来。系统架构初始想法很简单,先做出来,然后在修改添加功能,直至完善,这是一个初始的设计思路,界面发送http请求到webApi,然后请求到控制器,控制器调用请求方法,请求方法调用请求数据,然后返回,中间有一步是通过控制器,将model转为viewModel,原创 2021-04-19 12:58:06 · 1448 阅读 · 1 评论 -
Blazor + Ant Design + .NET 5快速开发框架(6)AntDesignAdmin-404 给MainLayout传参
目录前言404页面给MainLayout传递参数运行效果代码地址前言虽然404页面很简单,而且AntDesign也给出来页面,但是我在实际过程中发现了一个有趣问题,如果我们组件相互调用时没有问题的,但是如果在Blzaor组件页面中调用Layout时候该怎么办呢?比如我们想在当前页面,页面传递给MainLayout参数,让MainLayout随着组件的不同情况发生改变,这就很有意思了,我是这样的一个简单问题,我登录和404想用同一个Layout,就是我们上节的EmptyLao.原创 2021-02-08 16:07:48 · 953 阅读 · 0 评论 -
Blazor + Ant Design + .NET 5快速开发框架(6)AntDesignAdmin登录界面
登录界面登录界面设计时候想用一个背景图然后加一个登录框即可,简单大气,所以我们先设计一个登录框,用到了AntDesign的卡片,然后上面加入用户名和密码的输入框,加一个按钮即可,我们来看下效果。<div style="padding:30px"> <Card Bordered="true" Title=@("用户登录") Style="width:400px" Hoverable="true"> <Body>原创 2021-02-07 18:55:23 · 5827 阅读 · 0 评论 -
Blazor + Ant Design + .NET 5快速开发框架(5)AntDesignAdmin面包屑的自动化
目录运行效果图制作面包屑信息处理面包屑生成代码地址运行效果图面包屑的作用很简单,也是很实用的功能当系统拥有超过两级以上的层级结构时; 当需要告知用户『你在哪里』时; 当需要向上导航的功能时。制作面包屑的代码很简单,只需下面代码即可,但是我们要做的是可以自动化,下面是写死的,每个页面写一次也太麻烦了,虽然功能简单,但是涉及知识很多。 <Breadcrumb> <BreadcrumbItem> ...原创 2021-02-04 15:18:24 · 1434 阅读 · 6 评论 -
Blazor + Ant Design + .NET 5快速开发框架(4)AntDesignAdmin完善
目录运行截图Blazor webassembly读取配置MainLayout.razor.cs收缩BUG更改RenderFragment使用总结代码地址运行截图话不多说先放截图,经过一番修改,终于有点样子了,这一版本可以留下来,等其他开发继续使用Blazor webassembly读取配置blazor webassembly读取配置和其他有点不一样,他的appsettings.json需要放在wwwroot/下面然后注入读取配置[I.原创 2021-02-03 18:40:22 · 1682 阅读 · 0 评论 -
Blazor + Ant Design + .NET 5快速开发框架(3)AntDesignAdmin搭建
目录MainLayout.razorNavMenu.razorwwwroot/app.css运行效果知识点AntDesign是一套企业级框架,但是目前还没有提供admin后台管理模板,只能自己搭建一个了,那么接下来开始搭建MainLayout.razor@inherits LayoutComponentBase@code{ bool collapsed; string ImgStr = "./Images/logo.PNG"; void to原创 2021-02-03 01:37:30 · 4206 阅读 · 1 评论 -
Blazor + Ant Design + .NET 5快速开发框架(2) - AntDesign的引用
搭建AntDesign的后台搭建很简单,官网给出了详细的教程1、现在NuGet里面搜索AntDesign,然后安装,这里我安装的版本是:0.6.0.或者进入应用的项目文件夹,安装 Nuget 包引用$ dotnet add package AntDesign --version 0.6.0-*2、在项目中注册:services.AddAntDesign();因为我的项目还没有添加Startup,就在Program里面注册了:builder.Services.AddA.原创 2021-02-02 16:33:20 · 1952 阅读 · 1 评论 -
Blazor + Ant Design + .NET 5快速开发框架(1) - 项目创建
目录序言模式选择项目创建序言.net 5发布至今已经有一段时间了,但是在国内一直不温不火,虽然心里可惜,但是没有什么办法,作为.net开发的一员,只能在前进的道路上留下一笔,这次使用Blazor是微软新出的前端框架,采用c#代替JavaScript,类似与Vue,前后端绑定,而AntDesign是蚂蚁金服开发和正在使用的一套企业级的前端设计,基于blazor的ui库。这套框架很早之前就想写了,但是那会Blazor一直不成熟,虽然是代替JavaScript,但是现阶段并不能全部抛弃J.原创 2021-02-01 01:55:28 · 3999 阅读 · 2 评论