您现在的位置是：网站首页> 编程资料编程资料
微信小程序实现列表条件筛选_javascript技巧_
2023-05-24
311人已围观
简介 微信小程序实现列表条件筛选_javascript技巧_
本文实例为大家分享了微信小程序实现列表条件筛选的具体代码，供大家参考，具体内容如下
最近一个旅游项目，关于筛选框的代码
wxml文件
酒店类型 价格 {{index}} {{index}}
js文件：
点击酒店类型，展示筛选酒店的条件
listqy: function (e) { console.log('触发时机---点击酒店类型的时候') if (this.data.qyopen) { console.log(this.data.qyopen) this.setData({ qyopen: false, nzopen: false, nzshow: true, qyshow: false, isfull: false, shownavindex: 0 }) } else { this.setData({ qyopen: true, nzopen: false, nzshow: true, qyshow: false, isfull: true, shownavindex: e.currentTarget.dataset.nav }) } },点击一级菜单，展示对应的二级菜单
selectleft: function (e) { console.log('用户选中左边菜单栏的索引值是：' + e.target.dataset.city); if (e.target.dataset.city === '床型、早餐') { console.log('哈哈') this.setData({ isshowradio: true // 如果是早餐和床型的话，就让选择早餐的按钮显示 }) } else { this.setData({ isshowradio: false }) } this.setData({ citycenter: this.data.cityleft[e.currentTarget.dataset.city], select1: e.target.dataset.city, select2: '' }); },点击二级菜单
selectcenter: function (e) { console.log(e.target.dataset.value) console.log('用户选中右边边菜单栏的索引值是：' + e.target.dataset.value, this.data.select1); let _this = this if (_this.data.select1 === '酒店类型') { _this.data.type = e.target.dataset.city console.log(_this.data.type) } if (_this.data.select1 === '设施') { _this.data.facility = e.target.dataset.city console.log(_this.data.facility) } if (_this.data.select1 === '地理位置') { _this.data.maxdistance = e.target.dataset.value console.log(_this.data.maxdistance) } if (_this.data.select1 === '床型、早餐') { _this.data.cbedtype = e.target.dataset.city console.log(_this.data.cbedtype) } this.setData({ select2: e.target.dataset.city }); }, 
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持。
您可能感兴趣的文章:
