创建于:2023-06-21 13:33
更新于:2023-10-07 10:35
浏览:708
SP0069.牛腩学Blazor
进击吧!Blazor
视频:
https://www.bilibili.com/video/BV1Jf4y187M1/?spm_id_from=333.337.search-card.all.click&vd_source=d2489288561fc6f77fce2e2ee18cfcfe
博客:
https://www.cnblogs.com/MSReactor/category/1917442.html
用Blazor做一个商品管理系统,增删改查商品,界面用Ant Design Blazor, 数据库用SQL SERVER 2022 Express,操作数据库SqlSugar
模型:
(商品)Product: ProductId, ProductName, ThumbnailImage,
(分类)Category: CategoryId,CategoryName,ParentId,
接口:
(商品)IProduct:Add(Models.Product model), Delete(int id), Update(Models.Product model), GetList(), GetModel(int id),
界面:
页面分上下二部分,上方就是一个LOGO和新增商品按钮,下方又分为左右二部分,左边是商品分类树,右边是商品列表,显示商品图片,名称,
Blazor 中的 WebAssembly和Server的区别:
https://zhuanlan.zhihu.com/p/391305795
ASP.NET Core Blazor 窗体和输入组件:
https://learn.microsoft.com/zh-cn/aspnet/core/blazor/forms-and-input-components?view=aspnetcore-7.0#built-in-input-components
ASP.NET Core Blazor 路由和导航:
https://learn.microsoft.com/zh-cn/aspnet/core/blazor/fundamentals/routing?view=aspnetcore-7.0
第05集待做:
1.删除商品 【√】
2.查询商品(面包屑右边) 【√】
3.点分类显示商品,面包屑 【√】
4.新增商品→选择分类 【√】
5.新增商品→上传图片 【√】
6.新增按钮点击后改变提示文字 【√】
7.登录后才能增,删,改(弹窗登录) 【√】
8.分类 增,删,改(无限级) 【√】
9.数据存到数据库中 【√】
个人理解:
以前:后台读取数据库中的数据,然后直接修改页面上HTML内容,js:documentById , aspx:Label控件
blazor: HTML内容与某个变量相互绑定,后台读取数据库后直接修改变量的值,变量值改变,HTML也会根着改变
SqlSugar:https://www.donet5.com/Home/Doc
目录:
01.Blazor增删改查 2023年06月10日 48分钟
02.引用AntDesign并测试弹出框 2023年06月10日 31分钟
03.设计界面 2023年06月11日 39分钟
04.代码简单整合 2023年06月11日 38分钟
05.纸上谈bug 2023年06月16日 16分钟
06.删除商品及查询商品 2023年06月16日 24分钟
07.商品分类 2023年06月16日 50分钟
08.分类选择框 2023年06月16日 24分钟
09.上传图片 2023年06月16日 41分钟
10.权限控制 2023年06月16日 24分钟
11.数据存储到数据库中 2023年06月16日 54分钟
12.分类管理 2023年06月17日 48分钟
13.树拖拽 2023年06月17日 31分钟
14.分页 2023年06月21日 45分钟
15.商品多图 2023年06月21日 61分钟
16.部署 2023年06月21日 40分钟
合计:10小时14分钟
视频在线观看:https://www.bilibili.com/video/av272186102/