Blazor 通知システム
インストール
Dignite.Abp.NotificationCenter.Blazor
NuGet パッケージを Blazor プロジェクトにインストールします。モジュールクラス の
[DependsOn(...)]
プロパティリストにDigniteAbpNotificationCenterBlazorModule
を追加します。Dignite.Abp.NotificationCenter.HttpApi.Client
NuGet パッケージを HttpApi.Client プロジェクトにインストールします。モジュールクラス の
[DependsOn(...)]
プロパティリストにDigniteAbpNotificationCenterHttpApiClientModule
を追加します。Dignite.Abp.NotificationCenter.Blazor.WebAssembly
NuGet パッケージを Blazor.WebAssembly プロジェクトにインストールします。モジュールクラス の
[DependsOn(...)]
プロパティリストにDigniteAbpNotificationCenterBlazorWebAssemblyModule
を追加します。Blazor プロジェクトで abp bundle を実行します。
通知コンポーネント
各通知コンポーネントは、通知アイコンコンポーネントと通知データコンポーネントから構成されます:
通知アイコンコンポーネントを作成します
NotificationIconComponentBase
抽象クラスを継承して Blazor コンポーネントを作成します。NotificationName
:通知の定義 で設定された通知名です。@using Dignite.Abp.Notifications.Components; @using NotificationCenterSample.Notifications; @inherits NotificationIconComponentBase <Icon Name="IconName.Grin" IconSize="IconSize.Large" TextColor="TextColor.Primary"></Icon> @code { public override string NotificationName { get; } = NotificationCenterSampleNotifications.TestNotification; }
対応する通知名のアイコンコンポーネントが作成されていない場合、システムはデフォルトのアイコンコンポーネントを使用します。
通知データコンポーネントを作成します
NotificationDataComponentBase<TNotificationData>
抽象クラスを継承して Blazor コンポーネントを作成します。TNotificationData
:NotificationData
抽象クラスから継承した型です。システムには、組み込みの
MessageNotificationData
およびLocalizableMessageNotificationData
の2つの通知データタイプ用のコンポーネントが提供されています。MessageNotificationData
通知データタイプのコンポーネントのコード例:@using Dignite.Abp.Notifications @inherits NotificationDataComponentBase<MessageNotificationData> <Paragraph Style="min-width:300px;"> @NotificationData.Message </Paragraph>
サンプル
GitHub からサンプルをダウンロードし、指示に従って Blazor 版通知システムを体験してください。