MudBlazor /raw/dev/content/ MudBlazor -github-nobg-dark.png“>”> MudBlazor /raw/dev/content/ MudBlazor -github -nobg.png“>”>
料理的材料设计组件
MudBlazor是雄心勃勃的材料设计组件库。加速您的Web应用程序开发并构建直观的用户界面,利用C#的全部功能适应和扩展此开源框架。
文档⚡互动游乐场
?为什么选择MudBlazor ?
?美丽的材料设计组件。
用最小的JavaScript完全编写C#。
丰富的文档,有广泛的例子。
?没有第三方依赖性以最大程度的灵活性。
✅稳定性的广泛测试覆盖范围。
repo统计
入门
我们在模板存储库中有现成的模板,或遵循以下快速安装指南:
安装
安装程序包:
dotnet add package MudBlazor添加到_Imports.razor :
@ using MudBlazor添加到MainLayout.razor或App.razor :
< MudThemeProvider />
< MudPopoverProvider />
< MudDialogProvider />
< MudSnackbarProvider />添加到您的html head ( index.html / _Layout.cshtml / _Host.cshtml / App.razor ):razor):
MudBlazor .min.css" rel="stylesheet" />">
< link href = " https://fonts.**g*oogleapis.com/css?family=Roboto:300,400,500,700&display=swap " rel = " stylesheet " /> < link href = " _content/ MudBlazor / MudBlazor .min.css " rel = " stylesheet " />
在body末端添加到默认的大风脚本:
MudBlazor .min.js"></script>">
< script src = " _content/ MudBlazor / MudBlazor .min.js " ></ script >
添加到Program.cs的相关部分:
using MudBlazor . Services ; builder . Services . AddMudServices ( ) ;示例用法
MudBlazor is @Text
</MudText>
<MudButton Variant="Variant.Filled"
Color="Color.Primary"
OnClick="ButtonOnClick">
@ButtonText
</MudButton>
@code {
string Text { get; set; } = "????";
string ButtonText { get; set; } = "Click Me";
int ClickCount { get; set; }
void ButtonOnClick()
{
ClickCount += 1;
Text = $"Awesome x {ClickCount}";
ButtonText = "Click Me Again";
}
}">
< MudText Typo = " Typo.h6 " > MudBlazor is @Text </ MudText > < MudButton Variant = " Variant.Filled " Color = " Color.Primary " OnClick = " ButtonOnClick " > @ButtonText </ MudButton > @code { string Text { get ; set ; } = " ???? " ; string ButtonText { get ; set ; } = " Click Me " ; int ClickCount { get ; set ; } void ButtonOnClick () { ClickCount += 1 ; Text = $" Awesome x { ClickCount } " ; ButtonText = " Click Me Again " ; } }
有关更多详细信息,请参阅我们网站上的完整安装指南。
?贡献
社区的贡献使MudBlazor成功。
如果您对C#,Glazor,JavaScript或CSS感到满意,我们会喜欢您的帮助!
无论是修复错误,添加功能还是改进文档,每个贡献都很重要。
我们旨在迅速审查和合并非破坏拉动请求。
对于更大的功能或更改,请随时与我们聊天,以在潜水之前获得反馈。
查看我们的贡献指南,以开始并进一步了解该项目的运作方式。
✅如果PR修复了您报告的内容,请在本地测试预览版本,以确保您的应用按预期工作。
版本支持
| MudBlazor | 。网 | 支持 |
|---|---|---|
| 5.xx | .NET 5 | 结束(2022年1月) |
| 6.xx | .NET 6,.NET 7,.NET 8 | 结束(2025年1月) |
| 7.xx | .NET 7,.NET 8 | 有限的支持 |
| 8.xx | .NET 8,.NET 9 | ✔️全力支持 |
提示
升级?检查我们的迁移指南以寻求破坏变化的帮助。
警告
- 不支持静态渲染 - 了解更多。
- 可能不支持较旧的浏览器。使用现代的,最新的浏览器 - 大店支持的平台。
下载源码
通过命令行克隆项目:
git clone https://github.com/MudBlazor/MudBlazor.git