logo
为了能更好地了解您的商业使用需求,请参与 Ant Design Blazor 商业应用调查,一起建设商业应用社区,为企业系统研发赋能!

Alert警告提示

警告提示,展现需要关注的信息。

何时使用

  • 当某个页面需要向用户显示警告的信息时。
  • 非浮层的静态展现形式,始终展现,不会自动消失,用户可以点击关闭。

Examples

最简单的用法,适用于简短的警告提示。

expand code expand code

显示关闭按钮,点击可关闭警告提示。

expand code expand code

可口的图标让信息类型更加醒目。

expand code expand code

页面顶部通告形式,默认有图标且 Type 为 'warning'。

expand code expand code

平滑、自然的卸载提示。

expand code expand code

共有四种样式 success、info、warning、error。

expand code expand code

含有辅助性文字介绍的警告提示。

expand code expand code

可以自定义关闭,自定义的内容会替换原先的关闭按钮。

expand code expand code

配合 CSS @keyframes 实现消息轮播通知栏。

expand code expand code

利用 .NET 6 提供的 ErrorBoundary 进行友好的 Blazor 错误处理 包裹组件。

expand code expand code

Alert API#

属性 描述 类型 默认值
AfterClose 属性关闭动画完成时调用 EventCallback<MouseEventArgs> --
Banner 属性是否显示为banner Boolean false
Closable 属性是否可以关闭Alert Boolean false
CloseText 属性关闭要显示的文本 String --
Description 属性警报的附加内容 String --
Icon 属性自定义图标,showIcon为true时有效 RenderFragment --
Message 属性警示内容 String --
MessageTemplate 属性内容模板 RenderFragment --
ShowIcon 属性是否显示图标。 Boolean? --
Type 属性警报样式类型,选项:成功、信息、警告、错误 AlertType? --
OnClose 属性Alert 关闭时的回调。 EventCallback<MouseEventArgs> --
ChildContent 属性附加内容 RenderFragment --
Id 属性组件 HTML 的 ID String Uniquely Generated ID
Class 属性为 DOM 元素指定一个或多个类名。 String --
Style 属性指定 DOM 元素的内联样式。 String --
RefBack 属性一个 ForwardRef 实例。您可以使用 AntDesign.ForwardRef.Current 获取对内部 DOM 的引用。 ForwardRef --
文档已更新,请点击 此处 更新。
A new version of this app is available. Click here to update.