wxml:
<!-- header -->
<view class="flex flex-col flex-fv flex-fh">
<view class="flex flex-hb flex-ve text-9EA0A4 font32">
<view class="flex flex-ve" bindtap="changeTab">
<view class="mr40 line_height1 {{ activeIndex == 0 ? 'text-2E3238 font48 font-w':'' }}" data-index="0">tab0</view>
<view class="mr40 line_height1 {{ activeIndex == 1 ? 'text-2E3238 font48 font-w ':'' }}" data-index="1">tab1</view>
<view class="mr40 line_height1 {{ activeIndex == 2 ? 'text-2E3238 font48 font-w':'' }}" data-index="2">tab2</view>
</view>
</view>
<view class="f1">
<swiper class="flex-fv" bindchange="bindSwiperChange" current="{{ activeIndex }}">
<!-- tab0 -->
<swiper-item class="bg-red">
<scroll-view class="flex-fv" scroll-y bindscrolltolower="scrolltolower">
<block wx:for="{{ tabData[0].list }}" wx:key="index">
<view></view>
</block>
</scroll-view>
</swiper-item>
<!-- tab1 -->
<swiper-item class="bg-green">
<scroll-view class="flex-fv" scroll-y bindscrolltolower="scrolltolower">
<block wx:for="{{ tabData[1].list }}" wx:key="index">
<view></view>
</block>
</scroll-view>
</swiper-item>
<!-- tab2 -->
<swiper-item class="bg-red">
<scroll-view class="flex-fv" scroll-y bindscrolltolower="scrolltolower">
<block wx:for="{{ tabData[2].list }}" wx:key="index">
<view style="height: 200rpx;" class="bg-white mt20">{{ index }}</view>
</block>
</scroll-view>
</swiper-item>
</swiper>
</view>
</view>
js:
import { dateFormatStr } from "../../../utils/util";
const app = getApp()
Page({
/**
* 页面的初始数据
*/
data: {
tabData:[
{
list:[],
page:1
},
{
list:[],
page:2
},
{
list:[],
page:3
}
],
activeIndex:0,
page:1,
pageSize:10,
userInfo: {}, //登录人个人资料
},
/**
* 生命周期函数--监听页面加载
*/
onLoad(options) {
this.setData({
userInfo: app.globalData.userInfo,
});
this.getList()
},
//tab切换
changeTab(e){
const { index } = e.target.dataset;
if(index >= 0){
this.setData({
activeIndex:index,
});
}
this.getList()
},
/**
* swiper切换
* @param {*} e
*/
bindSwiperChange:function(e){
var { current } = e.detail;
this.setData({
activeIndex:current,
});
this.getList()
},
/**
* 获取list
*/
getList(){
const { tabData,activeIndex,pageSize } = this.data
const addlist = []
this.setData({
[`tabData[${activeIndex}].list`]:tabData[activeIndex].list.concat(addlist)
})
},
/**
* 页面上拉触底事件的处理函数
*/
scrolltolower() {
const { tabData,activeIndex } = this.data
console.log('tabData:',tabData)
tabData[activeIndex].page++
this.getList()
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
}
})