HxToastContainer
wrapper for displaying HxToast
messages dispatched through IHxMessengerService
.
Component is using IHxMessengerService
injected service.
Informational messages are automatically hidden after 5 seconds, warning and error messages remain visible until manually closed.
<HxButton Text="Show information" OnClick="HandleAddInformationButtonClick" Color="ThemeColor.Primary" />
<HxButton Text="Show warning" OnClick="HandleAddWarningButtonClick" Color="ThemeColor.Warning" />
<HxButton Text="Show error" OnClick="HandleAddErrorButtonClick" Color="ThemeColor.Danger" />
@code {
[Inject] protected IHxMessengerService Messenger { get; set; }
private void HandleAddInformationButtonClick()
{
Messenger.AddInformation(title: "Data encrypted", message: "All your data has been encrypted. To decrypt your data share $100 with all your teammates.");
}
private void HandleAddWarningButtonClick()
{
Messenger.AddWarning(title: "Bio hazard!", message: "Bio hazard detected in your office!");
}
private void HandleAddErrorButtonClick()
{
Messenger.AddError(title: "Error", message: "An error occurred during showing messenger message.");
}
}
You should place the HxMessenger
component itself in the layout component (MainLayout.razor
) to make it work!
@inherits LayoutComponentBase
<HxMessenger Position="ToastContainerPosition.TopEnd" />
@Body
Call services.AddHxMessenger()
in Startup.cs
to set up related services.
public void ConfigureServices(IServiceCollection services)
{
// ...
services.AddHxMessenger();
// ...
}
Use the messenger.Clear()
method (IHxMessengerService
) if you want all messages to disappear immediately.
Name | Type | Description |
---|---|---|
CssClass | string |
Additional CSS class. |
Position | ToastContainerPosition |
Position of the messages. The default value is ToastContainerPosition.None . |