digi
1
いつもお世話になっております。
Listviewのfilterを、部分一致で表示させる方法について質問させていただきます。
行いたい動作は、componentのwidget stateに入力した内容が、部分的に該当するものをListviewに表示させる という動作です。
Listviewのクエリ設定は画像の通りです。検索ボタンにはbottomsheetのアクションを設定し、「test_search」componentを開くようにしています。
コンポーネントにあるボタンを押下すると、メインページへ移動しtextfieldの値をparameterとして受け渡す設定にしました。
現状の設定では、filterの設定が「Query document」 Equal to 「page parameter」としているため、値が完全に一致する場合のみListviewの値が表示されるようになってしまいます。部分一致するものを表示させる方法があればご教示いただきたく存じます。
(例:Listview内のドキュメントは「text1」「text2」「text10」のため、検索ワードを「text1」とした場合、「text1」と「text10」が表示されるようにしたいです。)
基本的に、Firebaseは、部分一致に対応してないはずで、
対応方法は、以下の3つのどれかだと思います。
案1 Algoliaを使ったサードパーティ検索エンジンの導入
Algoliaは、高速で精度の高い検索エンジンで、FirestoreやSupabaseといったデータベースと簡単に連携できる機能を提供しています。Firestoreで部分一致検索が難しい場合、Algoliaを使うことでリアルタイム検索を実現できます。
FlutterFlowのアクション設定で、Algolia APIを呼び出し、部分一致検索を行うように設定します。Algoliaはデフォルトで部分一致検索に対応してます。
案2 Supabaseを使った部分一致検索
SupabaseはPostgreSQLをベースとしたデータベースを提供しており、部分一致検索を簡単に実装できるクエリ機能が用意されています。LIKE
クエリやフルテキスト検索を活用することで、Firestoreよりも柔軟な検索が可能です。
ilike()
関数を使うことで、入力されたテキスト(searchText
)を含むデータが返されます。この結果をFlutterFlowのListView
に表示します。
案3 Cloud Functionを使った部分一致検索
Google Cloud Functionsを使って、Firestoreに直接クエリを送信し、部分一致検索を実装する方法です。Cloud Functionsでは、Firestoreの制約を回避して、部分一致検索が可能
- FlutterFlowの「Cloud Functions」から、作成した
searchPosts
関数を呼び出します。
- 検索結果を
ListView
に表示するように設定し、ユーザーが入力した検索語に基づいて結果を取得します。
その他、上記が難しければ Simple Searchが微妙に部分一致対応しているので、使ってもいいかもしれません。
digi
3
迅速なご回答ありがとうございます。さっそく試してみようと思います。
「いいね!」 1