富蕴县建设局网站,做网站灵宝,电子商务网站策划书布局设计,泰州建设网站文章目录 前言基本文件配置引入Layout组件 语法介绍pagecodeRazor 语法[ 显式表达和隐式表达](https://learn.microsoft.com/zh-cn/aspnet/core/mvc/views/razor?viewaspnetcore-7.0#explicit-razor-expressions) 绑定简单绑定双向绑定带参数的函数绑定 依赖注入 前言
Blazor… 文章目录 前言基本文件配置引入Layout组件 语法介绍pagecodeRazor 语法[ 显式表达和隐式表达](https://learn.microsoft.com/zh-cn/aspnet/core/mvc/views/razor?viewaspnetcore-7.0#explicit-razor-expressions) 绑定简单绑定双向绑定带参数的函数绑定 依赖注入 前言
Blazor最重要的是Razor组件和cshtml页面。两个最大的区别就是cshtml是完整的html,Razor是不完整的html
微软Razor 语法官方文档
我的Blazor基础语法个人总结
C# Blazor 学习笔记(12)css样式设置
C#小轮子Visual Studio自动编译Sass文件
基本文件配置 Components组件Controller控制器/APILayout布局Models实体对象Pages页面Service服务/数据库查询Utils通用工具
引入Layout组件
语法介绍 page
路由路径可以多路由
page /index
//指向/index路径
h1 classtitleHello, world!/h1
code code声明代码空间 xxx.razor.cs 对应文件 Tips:partial class即部分class编译的时候会组合成一个完整的class
Razor 语法 显式表达和隐式表达 绑定
简单绑定
h1Title/h1
button onclickTitleBtn按钮点击/button
h1RangeValue/h1
code{public string Title { get; set; } 我是Code Title字符串;/// summary/// 按钮事件/// /summarypublic void TitleBtn(){Title 我被函数改变了;}
}注意这里的绑定是单向绑定。不是双向绑定双向绑定需要用到Bind语法
双向绑定 button onclickTitleBtn按钮点击/button
input typerange min0 max10 bindRangeValue/
h1RangeValue/h1
code{public decimal RangeValue { get; set; } 2;/// summary/// 按钮事件/// /summarypublic void TitleBtn(){RangeValue;}
}带参数的函数绑定
Blazor 事件处理 解决方案
οnclick“(e你的函数))” h1Title/h1
button onclick(eTitleBtn2(函数2带参数按钮点击))带参数按钮点击/buttoncode{public string Title { get; set; } 我是Code Title字符串;public void TitleBtn2(string str){Title str;}
}依赖注入
依赖注入有两种我们这里统一使用cs的注入方式 [Inject][NotNull]private NavigationManager navigationManager { get; set; }Blazor的路由
使用 public void LoginBtn(){Console.WriteLine(登录);navigationManager.NavigateTo(/index);}
