Blazor通知概述
的信息Blazor通知组件以及它的主要特点。
Notification组件向用户呈现一条简短的消息,其中包含有关应用程序中进程状态的信息。使用它的设置,你可以自定义它的位置,动画选项和渲染。
Notification组件是《Blazor》的teleerik UI,一个专业级的UI库,有100个本地组件,用于构建现代和功能丰富的应用程序。要想尝试一下,注册一个30天的免费试用。
创建Blazor通知
- 添加
< TelerikNotification >
标签到你的剃刀页面。 - 通过获取组件引用
@ref
。 - 的实例
NotificationModel
类(由Telerik Blazor包提供),并将其传递给显示()
组件实例的方法。
@*这显示了一个简单的文本消息,自动隐藏*@ 添加一个基本通知 @code {public TelerikNotification NotificationReference {get;设置;}公共无效AddNotification() {NotificationReference。Show(new NotificationModel() {Text = "自动关闭通知",ThemeColor = themeconconstants .Notification.ThemeColor. primary});}}
参数
类型和默认值
描述
类
字符串
将在Notification组件的主包装元素上呈现的CSS类< div class = " k-notification-container”>
。你可以用那个类来控制组件的大小或z-index。你可以找到更多的信息和例子外观篇文章。
OnChange
EventCallback < bool >
此事件指示媒体查询字符串是否提供给媒体
参数匹配当前浏览器大小。它会在匹配和停止匹配时触发。看到事件文章获取更多信息。
AnimationType
AnimationType
枚举
褪色
允许您自定义通知的动画。你可以找到更多的信息和例子外观篇文章。
AnimationDuration
int
300
以毫秒为单位定义动画的持续时间。
VerticalPosition
NotificationVerticalPosition
枚举
底
定义通知的垂直位置。
HorizontalPosition
NotificationHorizontalPosition
枚举
正确的
定义通知的水平位置。
NotificationModel类属性
的NotificationModel
类用于向页面添加新通知。您可以使用它为想要显示的每条消息设置设置。该类包含以下属性:
财产
类型和默认值
描述
ThemeColor
字符串
通过该参数控制通知的颜色。你可以找到更多的信息和例子外观篇文章。
可闭
保龄球
真正的
如果设置为真正的
将出现一个关闭按钮,使用户能够关闭通知。如果您希望通知不自动关闭,您应该设置可闭
paramter来真正的
和CloseAfter
来0
。
CloseAfter
int
5000
允许您配置通知组件在多长时间后自动关闭。将其设置为0
防止自动关闭。
ShowIcon
保龄球
真正的
允许您指定图标是否应该出现在组件中。
图标
字符串
属性时将在组件中呈现的图标ShowIcon
参数设置为真正的
。中可以找到有关向teleerik组件添加图标的更多信息Telerik字体图标文章。
文本
字符串
将在Notification组件中呈现的文本。
下一个步骤
另请参阅