当前位置:网站首页>微信小程序云开发之模糊搜索
微信小程序云开发之模糊搜索
2022-08-02 03:23:00 【爱唱歌的前端】
以前在做前后端分离的项目时,要实现一些搜索框的模糊搜索时,运气好一点,后端攻城狮会处理好逻辑,前端只需在输入框的value值发生变化时去调用接口重新渲染数据就好了。运气差点,后端攻城狮只会给你一个总的数组,然后在值发生变化时得自己动手写逻辑去筛选数据。那么在微信小程序云开发上是怎么实现的了?
微信小程序云开发之模糊搜索
好的,我们先来开看一下我录制的一个小demo,在使用代码前我们需要注意一些细节。当我们直接用api去匹配数据库时一定要注意数据库操作权限的问题,否则不管匹配什么返回都是空的,如果是间接通过云函数去操作的话就不会有这种问题,具体看gif。

主要代码
要实现模糊搜索的话直接使用构造正则表达式就好了。
*官方文档API:Database.RegExp
*直接用api调用(需要数据库操作权限,会有限制20条的局限)
const db = wx.cloud.database()
// 直接调用
//msg为要搜索的集合,可以自己定义
db.collection('msg').where({
//text为要搜索的对象名,务必对应集合里面的名字
text: db.RegExp({
//inputValue为输入框的值,也是就要查询内容,可以自己定义
regexp: inputValue,
//大小写不区分
options: 'i',
})
}).get().then(res => {
console.log(res)
})
*通过云函数调用
/*------------------------小程序端代码---------------------------*/
//fuzzySearch为云函数的名字,可以自己定义
wx.cloud.callFunction({
name: 'fuzzySearch',
data: {
inputValue: inputValue
}
}).then(res => {
// console.log(res)
this.setData({
resultArr: res.result.data
})
})
/*------------------------云函数端代码---------------------------*/
// 云函数入口文件
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()
// 云函数入口函数
exports.main = async (event, context) => {
//输入框的值
let inputValue = event.inputValue;
return await db.collection('msg').where({
//text为要搜索的对象名,务必对应集合里面的名字
text: db.RegExp({
//从搜索栏中获取的value作为规则进行匹配。
regexp: inputValue,
//大小写不区分
options: 'i',
})
}).get()
}
需要源代码的可以点这下载,把代码拷贝到你项目的对应位置,记得上传云函数,另外在你的云数据库中创建相应集合,这样基本就没问题了==》百度网盘 ——提取码6w4m。
拷贝代码或者下载demo后报错的看这里,务必认真看完文章描述及录制的gif,检查自己创建的集合名字、搜索字段名是否对应得上,检查数据库的权限问题,最后别忘了上传云函数,都学云开发了,务必认真、细心,别拷了代码还不会用。 (╯°Д°)╯︵┻━┻
最后想补习云函数的可以点击这里哦!! 传送门
边栏推荐
猜你喜欢

parser = argparse.ArgumentParser() parsing

【我的创作纪念日】 3周年

subprocess.CalledProcessError: Command 'pip install 'thop'' returned non-zero exit status 1.

Phospholipid-Polyethylene Glycol-Aldehyde DSPE-PEG-Aldehyde DSPE-PEG-CHO MW: 5000

啃瓜记录第一天

UserWarning:火炬。meshgrid:在以后的版本中,它将被要求通过索引ing argu

AttributeError: ‘Upsample‘ object has no attribute ‘recompute_scale_factor‘

我的小笔记 =》原生微信小程序

环形链表---------约瑟夫问题

Scientific research reagent DMPE-PEG-Mal dimyristoylphosphatidylethanolamine-polyethylene glycol-maleimide
随机推荐
ssm various configuration templates
如何查看一个现有的keil工程之前由什么版本的keil IDE编译
云服务器安装部署Nacos2.0.4版本
C语言 内联函数
STM32 触发HardFault_Handler如何查找原因
[Basic Tutorial of Remote Control Development 1] Crazy Shell Open Source Formation Drone-GPIO (Remote Control Indicator Light Control)
basic operator
npm--package.json---require
Redis simple study notes
require模块化语法
Amazon sellers how to improve the conversion
L1-043 阅览室 (20分)
【博学谷学习记录】超强总结,用心分享 | 软件测试 接口测试基础
ThunderBirde无法登录问题、pycharm调试一直收集数据、RuntimeError: CUDA error: device-side assert triggered等疑难杂症解决
Phospholipid-Polyethylene Glycol-Aldehyde DSPE-PEG-Aldehyde DSPE-PEG-CHO MW: 5000
新工程加载YOLOV6的预训练权重问题
Source Insight 使用教程(2)——常用功能
np.isnan()
网址URL
Questions about your resume