Blazor 组件库 BootstrapBlazor 中Message组件介绍
组件介绍
上一篇文章我们介绍了Alert
组件,但是实际上Alert
组件只能直接把内容加载到页面内,这个做不到当作提示使用。
所以我们还有一个新的组件Message
。这个组件的样式几乎与Alert
组件一模一样。但是它可以浮动在窗口之上,4秒之后消失。
代码如下:
await MessageService.Show(new MessageOption()
{
Content = "这是一条提示消息",
Icon = "fa fa-info-circle",
ShowBar = true,
});
是的,你注意到了,这里用了MessageService
,这是一个类,专门用来显示Message
的消息提示的。
我们需要注入这个类
[Inject]
[NotNull]
public MessageService? MessageService { get; set; }
注入后即可使用。
组件的其他属性
下列属性与Alert
组件一致:
ChildContent
:内容的RenderFragment
,可以是简单的文本也可以是复杂的组件。所以我们可以利用警告框来实现例如强调等其他作用。
Class
:额外的css样式。
Color
:颜色,可选值有 Primary / Secondary / Success / Danger / Warning / Info / Dark
Icon
:图标,可以直接输入FontAwasome 4.7
的图标名,如fa fa-home
。
ShowDismiss
:显示关闭按钮。为true
则会在Alert
的最后显示一个关闭按钮。
OnDismiss
:类型为 EventCallback<MouseEventArgs>
的回调,此回调在点击关闭按钮后执行。
ShowBar
:左侧显示一个Bar。
多出的属性:
Placement
:消息出现的位置,类型为Placement
,可选值有 Top|Bottom
,默认值是Top
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 微软正式发布.NET 10 Preview 1:开启下一代开发框架新篇章
· 没有源码,如何修改代码逻辑?
· PowerShell开发游戏 · 打蜜蜂
· 在鹅厂做java开发是什么体验
· WPF到Web的无缝过渡:英雄联盟客户端的OpenSilver迁移实战