次の方法で共有


SearchBox コントロール (プレビュー)

[この記事はプレリリース ドキュメントであり、変更されることがあります。]

検索エクスペリエンスを作成するために使用されるコントロール。

SearchBox コントロール

説明

検索ボックス (SearchBox) は、サイトまたはアプリ内を検索して特定のアイテムを見つけるための入力フィールドを提供します。

このコード コンポーネントは、キャンバス アプリおよびカスタム ページで使用するための Fluent SearchBox コントロールのラッパーを提供します。

重要

  • これはプレビュー機能です。
  • プレビュー機能は運用環境での使用を想定しておらず、機能が制限されている可能性があります。 これらの機能を公式リリースの前に使用できるようにすることで、顧客が一足先にアクセスし、そこからフィードバックを得ることができます。

重要なプロパティ

Property 説明設定
SearchText ユーザーが入力するテキスト。 これを検索関数の入力として参照します。
IconName Fluent UI アイコンの名前 (Fluent UI アイコンを参照)。
Underlined SearchBox に下線を付けるかどうか。
DisableAnimation フォーカス時に SearchBox アイコンをアニメーション化するかどうか。
PlaceholderText 検索ボックスのプレースホルダー。

追加のプロパティ

Property 説明設定
Theme Theme オブジェクト (Json 形式ではありません)。 構成方法に関するガイドラインは、テーマ を参照してください。
AccessibilityLabel スクリーン リーダーの aria-ラベル。
InputEvent コントロールに送信するイベント。 例: SetFocus

検索動作を構成する

このコントロールを、通常ギャラリー、DetailsList、またはデータセットを表示できるコントロールと組み合わせて、検索インターフェイスが必要なアプリに追加します。

SearchBoxSearchText プロパティの値を使用する Search() または Filter() 式を使用して、検索エクスペリエンスを作成します。

Search( Accounts, SearchBox.SearchText, "name" )

制限

このコード コンポーネントは、キャンバス アプリとカスタム ページでのみ使用できます。