
图片说明:{{item[‘brand_id’]==select_brand[i]?’active’:’’}}:指的是如□□果点击选●中,则添加一□□□个“active”的类名,则当前选□□□□丨中的效□□果
预览的效•果是这样□□的:

下面着重□□□□讲下index.js文件的代☆码,因为重点□□的功能基□□□□本都是在□□□□这里实现。
先初始化□□□□品牌的参□□数:
Page({
data: {
brand_id:0,//品牌的id
brand_list:[],//品牌列表
select_brand: [],//选中的品牌id
},
再来看bindtap=”select_brand”函数:
select_brand: function (e) {
var that = this;
var brand_list = that.data.brand_list;//获取品牌□□□二维数组
var select_brand = that.data.select_brand;//获取所选□□□□的品牌数□□组
var key = parseInt(e.currentTarget.dataset.key)
for (var index = 0; index < brand_list.length; index++) {
if (key == index) {
console.log('brand_id:' + brand_list[key]['brand_id'])
if (util.inArray(select_brand,brand_list[key]['brand_id'])) {
//如果已经□□□□选中过了,那么再点▽击就要反◇选,即不选中
delete select_brand[key]; //删除已选□□□中的元素
} else {
select_brand[key] = brand_list[index]['brand_id'];//如果之前◤未选中,则添加这□□□□个元素,即当前品□□□牌名称会□□□出现选中□□□状态。
}
}
this.setData({
select_brand: select_brand;//这里需要□□重新赋值
})
}
函数说明,其中inArray函数如下□□□□图所示:


然后再来◤看小程序□□□□中的Onload:
onLoad: function (options) {
var that = this
var brand_id = that.data.brand_id;//获取改变●后的值
var select_brand = that.data.select_brand;
if (options.bid != undefined) {
brand_id = options.bid
//将所选的◉品id字符串转◥为数组
var select_brand = brand_id.split(",");//将字符串□□□用短号分□□□□割成数组;
that.setData({
select_brand:select_brand; //重新赋值
})
},
that.setData({
brand_id: brand_id
})
that.getprolist('正在加载□□□□数据...') //调用加载·商品列表□□的函数
},
getprolist: function (message) {
var that = this
var brand_id = that.data.brand_id;//获取改变□□后的值
/**参数获取□□□结束 */
var parm = '&bid=' + brand_id;
var request_newpro_url = util.getApiUrl(app, "/GList/goods_list", parm)
util._get(request_newpro_url,
function (res) {
var brand_list = res.data.brand_list;
var select_brand = that.data.select_brand;
var length1 = select_brand.length;
var select_brand2=[]
//这里需要□□□□重新设置◎一下所选□□□□品牌的key,这个非常★重要,不然会出□□□现匹配错□□乱的问题
for (var index = 0; index < brand_list.length; index++) {
for (var index2 = 0; index2 < length1;index2++){
if(brand_list[index]['brand_id']==select_brand[index2]){
select_brand2[index] = brand_list[index]['brand_id']
}
}
}
select_brand = select_brand2;
that.setData({
brand_list: res.data.brand_list,//品牌列表
select_brand: select_brand, //已选品牌□□□的数组
})
}
)
},
就这样,功能就讲□□完了,这里只是□□提供一种❖思路,或许大家□□会有更便□□□捷的方法□□□来实现这□□□个功能。
小程序开□□发中会遇□□到各种各□□样的问题,有些是官□□□方教材可□□□以找到的,有些是需□□□□要自己转□□变思考的,但无论如◣何,只要你多□□□想想,总有办法□□□□解决。
作者:陈应信