概要
データに指定したワードが含まれているか検索する機能をBubbleで実装する方法を解説します。今回は日本語検索にも対応した「Fuzzy search & Autocomplete」プラグインを使用します。
Bubbleでフリーワード検索を実装する方法
1. エレメントの配置
同一Group内に検索ワードを入力する「input」と検索結果を表示する「Repeating Group」、検索を開始する「Button」を配置します。※今回はテストデータとして都道府県(prefectures)データに予め用意しています。
親Groupは今回textのデータを元に検索する為、Type of contentを「text」に設定します。
input には検索キーワードを「text」で実施する想定とし、Type of contentを「text」に設定します。
RepeatingGroup には今回検索対象となる都道府県(prefectures)を表示させる為、Type of contentを「prefectures」に設定します。
2. ワークフローの設定
今回は、Buttonエレメントをクリックした際に、inputに入力したキーワードで検索するワークフローを設定します。
クリック時にRepeating Groupの検索結果に表示されうワークフローを作成します。
Data sourceに「Search for prefecturess」を設定します。
また都道府県名で検索する為、nameを基準にクリック時にinputエレメントに入力されていた値をもとにcontainsを設定しています。
