条件要素での事前読み込みの無効化

example

例: ケース情報の切り替え

必要に応じてカスタマーサービス担当者がレコードを表示または非表示にできるようにするケースのリストがあるとします。

問題

通常の営業担当のケース読み込みは約 100 ケースです。条件ステートメントでケースを非表示にすると、FlexCard に表示されなくても、100 件以上のケースがすべて HTML で表示されます。カスタマーサービス担当者がアクションを実行する前に HTML をすべて読み込む必要があるため、パフォーマンスに影響する可能性があります。

ソリューション

ケース ID、状況、作成日を表示します。他のすべてのケース情報をブロック要素でラップし、ShowInfo が true の場合にのみブロックを表示する条件で非表示にします。ShowInfo は、データソースから取得される Boolean 値で、デフォルトでは false に設定されています。[Preload Conditional Component (条件付きコンポーネントの事前読み込み)] プロパティを無効にします。

サービス担当者がケース情報の表示を切り替えることができる 2 つのアクションボタンを追加します。[ケース情報を表示] アクションボタンは、ShowInfo の値を true に設定し、ShowInfo が false の場合にのみボタンを表示する条件があります。[ケース情報を非表示] ボタンは、ShowInfo の値を false に設定し、ShowInfo が true の場合にのみこのボタンを表示する条件があります。各アクション要素の [Preload Conditional Component (条件付きコンポーネントの事前読み込み)] プロパティを無効にします。

プレビューでは、ケースごとに [ケース情報の表示] ボタンが表示され、[ケース情報] ブロックは表示されません。ブラウザーでコードを調べると、[ケース情報] ブロックの HTML と [ケース情報を非表示] ボタンは表示されません。