廢話不說征绎,直接上代碼
page1的前端代碼:
在每個view中都帶有對應的data-name木缝,并且綁定了方法bindViewTap
<view class="ab a1" bindtap="bindViewTap" data-name="a1"></view>
<view class="ab a2" bindtap="bindViewTap" data-name="a2"></view>
<view class="ab a3" bindtap="bindViewTap" data-name="a3"></view>
<view class="ab a4" bindtap="bindViewTap" data-name="a4"></view>
<view class="ab a5" bindtap="bindViewTap" data-name="a5"></view>
<view class="ab a6" bindtap="bindViewTap" data-name="a6"></view>
<view class="ab a7" bindtap="bindViewTap" data-name="a7"></view>
<view class="ab a8" bindtap="bindViewTap" data-name="a8"></view>
page1的js腳本:
獲取當前點擊的參數(shù)虏冻,并帶參進行頁面跳轉(zhuǎn)
//事件處理函數(shù)
bindViewTap: function(e) {
console.log(e.currentTarget.dataset.name)
var indexa=e.currentTarget.dataset.name;
wx.navigateTo({
url: '../page2/page2?name='+indexa
})
}
page2的前端代碼:
通過for-items進行數(shù)據(jù)遍歷
<block wx:for-items="{{list}}" wx:key="{{item.id}}" >
<navigator url="../index/index" class="navigator">
<view class="flex-item {{item.index=='2' ? 'bc_red' : ''}}" >
<image src="{{item.srcurl}}" style="width: 370rpx; height:498rpx;" bindload="imageLoad"></image>
<view style="margin-left:18rpx"> <text class="productext">{{item.text}}</text><text class="price">¥{{item.price}}</text></view>
</view>
</navigator>
</block>
page2的js腳本:
通過option拿到page1傳過來的值忍抽,進行判斷那槽,并用setData賦值給list酝掩;
onLoad: function (option) {
// console.log(option.name);
var lista ;
switch (option.name) {
case "a1": lista = this.data.list;
break;
case "a2": lista = this.data.list2;
break;
case "a3": lista = this.data.list3;
break;
case "a4": lista = this.data.list4;
break;
case "a5": lista = this.data.list5;
break;
case "a6": lista = this.data.list6;
break;
case "a7": lista = this.data.list7;
break;
case "a8": lista = this.data.list8;
break;
default: lista = [];
break;
}
this.setData({
list: lista
});
}