小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段

今天來給你們講講小程序的搜索功能。我這裏後臺數據庫用的是小程序雲開發的雲數據庫。因此咱們搜索的時候就要藉助雲開發來實現。html

一,需求

好比我這裏有以下的一些數據
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段數據庫

咱們想實現以下搜索需求小程序

  • 1,搜索標題(title)包含‘小石頭’的數據
  • 2,搜索標題(title)或者描述(desc)包含‘小石頭’的數據
  • 3,搜索標題(title)描述(desc)都包含‘小石頭’的數據

咱們知道數據庫查詢的時候有個where語句,可是where語句是查詢某個字段所有包含你輸入的內容時才能夠,因此單純用where語句來作搜索的話,結果太單一。因此咱們今天就來學習下模糊搜索功能的實現。咱們以上面三個需求爲例,來一個個講解。api

二,實現原理

咱們作模糊搜索的時候,其實就是查詢某個字段裏是否包含咱們的搜索詞。而模糊搜索須要藉助RegExp,來看看RegExp是什麼。
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段
官方文檔:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/reference-sdk-api/database/Database.RegExp.htmlide

  • 再來看看官方示例
    小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段
    可能看官方示例會有點糊塗,那麼咱們接下來就結合具體代碼來給你們作下講解。

三,模糊搜索的代碼實現

3-1,模糊搜索單個字段

  • 需求:搜索標題(title)包含‘小石頭’的數據

代碼以下
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段
查詢結果以下:
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段
能夠看到咱們成功的查詢到了標題裏包含‘小石頭的數據’學習

3-2,模糊搜索多個字段(知足一個便可)

  • 需求:搜索標題(title)或者描述(desc)包含‘小石頭’的數據

因爲咱們要查詢多個字段,因此咱們這裏用到了command高級操做符裏的or
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段
代碼以下:
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段
查詢結果:
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段
咱們來分析下這兩條數據3d

  • 1,標題和描述都包含‘小石頭’,符合
  • 2,雖然標題裏沒有‘小石頭’,可是描述裏有,因此也符合。
  • 3,title和desc裏都沒有‘小石頭’,因此不符合。
    小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段

3-3,模糊搜索多個字段(要同時知足)

  • 需求:搜索標題(title)描述(desc)都包含‘小石頭’的數據

因爲咱們要查詢多個字段,因此咱們這裏用到了command高級操做符裏的and
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段code

代碼以下:
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段regexp

查詢結果:
小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段
咱們來分析下這兩條數據視頻

  • 1,標題和描述都包含‘小石頭’,符合
  • 2,雖然desc裏沒有‘小石頭’,可是title裏沒有,因此也不符合。
  • 3,title和desc裏都沒有‘小石頭’,因此也不符合。
    小程序搜索功能,雲開發搜索,小程序雲開發模糊搜索,同時搜索多個字段

    四,源碼

    爲例方便你們使用,我把完整的代碼貼到這裏,後面你們使用時,直接複製這裏的代碼,略微改造下就能夠了。

    //我這裏簡單起見就把搜索詞寫死,正常應該用戶輸入的
    let searchKey = '小石頭'
    let db = wx.cloud.database()
    let _ = db.command
    
    db.collection('news')
      .where(_.or([
        {//標題
          title: db.RegExp({ //使用正則查詢,實現對搜索的模糊查詢
            regexp: searchKey,
            options: 'i', //大小寫不區分
          }),
        },
        {//描述
          desc: db.RegExp({
            regexp: searchKey,
            options: 'i',
          }),
        }
      ])).get()
      .then(res => {
        console.log('查詢成功', res)
      })
      .catch(res => {
        console.log('查詢失敗', res)
      })

到這裏就講完了,我後面會專門在雲開發入門的課程裏做爲實戰案例錄製視頻給到你們的:
《小程序雲開發入門視頻》

相關文章
相關標籤/搜索