[この記事はプレリリース ドキュメントであり、変更されることがあります。]
検索エクスペリエンスを作成するために使用されるコントロール。
Description
検索ボックス (SearchBox) は、サイトまたはアプリ内を検索して特定のアイテムを見つけるための入力フィールドを提供します。
このコード コンポーネントは、キャンバスおよびカスタム ページで使用するための Fluent UI SearchBox コントロールのラッパーを提供します。
Important
- これはプレビュー機能です。
- プレビュー機能は運用環境での使用を想定しておらず、機能が制限される可能性があります。 これらの機能は、お客様が早期にアクセスしてフィードバックを提供できるように、公式リリースの前に利用できます。
重要なプロパティ
| 財産 | Description |
|---|---|
SearchText |
ユーザーが入力するテキスト。 これを検索関数の入力として参照します。 |
IconName |
Fluent UI アイコンの名前 (Fluent UI アイコンを参照)。 |
Underlined |
SearchBox に下線を付けるかどうか。 |
DisableAnimation |
フォーカス時に SearchBox アイコンをアニメーション化するかどうか。 |
PlaceholderText |
検索ボックスのプレースホルダー。 |
追加のプロパティ
| 財産 | Description |
|---|---|
Theme |
Theme オブジェクト (Json 形式ではありません)。 構成方法に関するガイドラインは、テーマ を参照してください。 |
AccessibilityLabel |
スクリーン リーダーの aria-ラベル。 |
InputEvent |
コントロールに送信するイベント。 例: SetFocus。 |
例
検索動作を構成する
このコントロールを､通常ギャラリー、DetailsList、またはデータセットを表示できるコントロールと組み合わせて、検索インターフェイスが必要なアプリに追加します。
Search() または Filter() 式を使用して、SearchText の SearchBox プロパティ値を利用した検索エクスペリエンスを作成します。
Search( Accounts, SearchBox.SearchText, "name" )
制限事項
このコード コンポーネントは、キャンバス アプリとカスタム ページでのみ使用できます。