最近做小程序云开发,做一个多字段搜索功能;
本人不会,然后找了一个很牛笔的回答!特此做笔记,以备他日所用!
看完后清楚明了!
下面是对应的跳转链接
跳转
小石头牛笔!
下面是我改后的代码!虽然大体类似
先给大家看看我做出的效果图片:
html
<view class="woods-input">
<input bindinput="searchinput" value="{{searchvalue}}" type="text" placeholder="请输入搜索相关文字"></input>
<button bindtap="suredetail" type="primary" size="mini">确定</button>
</view>
<view class="woods-all">
<view class="woods-content" wx:for="{{lists}}" wx:for-item='i' wx:key='lists' bindtap="todetail" data-img='{{i.img}}' data-name='{{i.name}}'>
<image src="{{i.img}}"></image>
<text>{{i.name}}</text>
</view>
</view>
js
data: {
lists: [
],
searchvalue:''
},
suredetail: function () {
var that = this
let key = that.data.searchvalue;
console.log("查询的内容", key)
const db = wx.cloud.database();
const _ = db.command
db.collection('woods-wihte').where(_.or([{
name: db.RegExp({
regexp: '.*' + key,
options: 'i',
})
},
{
classification: db.RegExp({
regexp: '.*' + key,
options: 'i',
})
},
{
parameter: db.RegExp({
regexp: '.*' + key,
options: 'i',
})
},
{
remarks: db.RegExp({
regexp: '.*' + key,
options: 'i',
})
},
])).get({
success: res => {
console.log(res)
that.setData({
lists: res.data
})
},
fail: err => {
console.log(err)
}
})
},
//输入的value值
searchinput:function(e){
this.setData({
searchvalue: e.detail.value
})
},
// 将模糊查询到的数据重新渲染到页面
todetail:function(e){
console.log('获取列表数据', e.currentTarget.dataset.img)
wx:wx.navigateTo({
url: '/pages/woodsdetail/woodsdetail?img=' + e.currentTarget.dataset.img + '&name=' + e.currentTarget.dataset.name +''
})
},
// 页面加载,渲染数据
onLoad: function(options) {
var that = this
const db = wx.cloud.database();
//woods-wihte 是数据库的集合名称
db.collection('woods-wihte').get({
success: function(res) {
console.log('返回数据:', res.data)
that.setData({
lists: res.data
})
}
})
},
就酱紫!哈哈哈