PHP で WeChat アプレット検索ボックスのドロップダウンメニュー機能を実装する方法-PHPチュートリアル-php.cn

PHP で WeChat ミニプログラム検索ボックスのドロップダウンメニュー機能を実装する方法

WeChat ミニプログラムの人気に伴い、ますます多くの企業が電子商取引に WeChat ミニプログラムを使用し始めています。セールスとマーケティング。検索ボックスは WeChat アプレットの非常に重要なコンポーネントであり、ユーザーが必要な製品や情報をすばやく見つけるのに役立ちます。ドロップダウンメニュー機能を使用すると、ユーザーは検索結果をより便利にフィルタリングできます。この記事では、PHP を使用して WeChat アプレットの検索ボックスのドロップダウンメニュー機能を実装する方法を紹介します。

1. WeChat アプレット開発環境の設定

まず、PHP を使用して WeChat アプレットの検索ボックスのドロップダウンメニュー機能を実装する前に、設定が完了していることを確認する必要があります。 WeChat アプレット環境の開発。特定の構成手順については、WeChat 公式ドキュメントを参照してください。ここでは繰り返しません。

2. 検索ボックスのドロップダウンメニュー機能を実装します

データベースから検索キーワードを取得します

検索ボックスのドロップダウンメニューを実装するには、ダウンメニュー機能では、まずデータベースから検索キーワードを取得する必要があります。ここでは、PHP の mysqli 拡張機能を使用してデータベースに接続し、SELECT ステートメントを使用してテーブルからデータを取得できます。

以下はサンプルコードです:

$mysqli = new mysqli("localhost", "username", "password", "database"); if ($mysqli->connect_errno) { echo "Failed to connect to MySQL: " . $mysqli->connect_error; exit(); } $query = "SELECT keyword FROM search_table"; $result = $mysqli->query($query); $keywords = array(); while ($row = $result->fetch_assoc()) { $keywords[] = $row["keyword"]; } $mysqli->close();

ログイン後にコピー

上記のコードでは、「database」という名前のデータベースに接続し、「search_table」という名前のテーブルからすべての検索キーワードを取得します。取得した検索キーワードは「$keywords」という名前の配列に格納されます。

ユーザー入力に基づいて検索キーワードをフィルター処理する

次に、ユーザー入力に基づいて一致する検索キーワードをフィルター処理して、それらを返す必要があります。小さなプログラムを与えます。

以下はサンプルコードです:

$keyword = $_GET["keyword"]; $results = array(); foreach ($keywords as $k) { if (strpos($k, $keyword) !== false) { $results[] = $k; } } echo json_encode($results);

ログイン後にコピー

上記のコードでは、まず $_GET["keyword"] を使用して、ユーザーが入力した検索キーワードを取得します。次に、すべての検索キーワードをループし、strpos 関数を使用して、ユーザーが入力したキーワードが含まれるかどうかを判断します。含まれている場合は、結果配列「$results」に追加します。

最後に、「$results」配列を JSON 形式に変換し、ブラウザに出力します。

ミニプログラムで検索ボックスのドロップダウンメニューを表示する

これで、ユーザー入力に一致する検索キーワードが取得されました。次に、これらの検索キーワードをミニプログラムの検索ボックスのドロップダウンメニューに表示する必要があります。

以下はサンプルコードです:

  {{ item }}

ログイン後にコピー

上記のコードは、「dropdown」という名前のビューコンポーネントを定義し、wx:if 変数と showDropdown 変数を使用して、それが表示されるかどうかを制御します。 showDropdown 変数が true の場合、ドロップダウンメニューが表示されます。

ビューコンポーネントでは、wx:for 変数と DropdownList 変数を使用してドロップダウンメニューの各項目をループしてレンダリングし、bindtap を使用してドロップダウンメニューの各項目のクリックイベントをバインドします。

ミニプログラムの JS ファイルでは、PHP インターフェイスを呼び出すことで、検索ボックスのドロップダウンメニューのデータを取得できます。

以下はサンプルコードです:

onInput: function(e) { var keyword = e.detail.value; if (keyword.length > 0) { wx.request({ url: "http://localhost/search.php?keyword=" + keyword, success: function(res) { var list = res.data; if (list.length > 0) { this.setData({ showDropdown: true, dropdownList: list }); } }.bind(this) }); } }

ログイン後にコピー

上記のコードは、「onInput」という名前のイベント処理関数を定義し、e.detail.value を使用して、検索でユーザーが入力したコンテンツを取得します。箱。

ユーザーが入力したコンテンツの長さが 0 より大きい場合、wx.request メソッドを呼び出して PHP インターフェイスを呼び出し、検索ボックスのドロップダウンメニューのデータを取得します。

データの取得に成功したら、showDropdown を true に設定し、取得したデータを DropdownList に設定して、検索ボックスのドロップダウンメニューを表示できるようにします。

3. 概要

上記の手順により、PHP を使用して WeChat アプレット検索ボックスのドロップダウンメニュー機能を簡単に実装できます。もちろん、具体的な実装プロセスは、実際のニーズに応じて調整および最適化する必要があります。この記事が皆様のお役に立てれば幸いです、読んでいただきありがとうございます。

以上がPHP で WeChat アプレット検索ボックスのドロップダウンメニュー機能を実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。