{{item.cont}}
wxss:
.scroll-box{display:flex;flex-wrap:nowrap;}
.menu-tab{
width:180rpx;
text-align:center;
height:100%;
color:#666;
border-right:1rpxsolid#999
}
.item-tab{
font-size:28rpx;
padding:8rpx;
}
.cont-box{
border-top:1pxsolid;
box-sizing:border-box;
}
.item-act{
background:linear-gradient(tobottomright,#6C53B1,#8B2EDF);
color:#fff;
border-radius:100px;
}
js:
varapp=getApp();
Page({
data:{
current:0,
//左侧菜单
tabList:[
{title:'tab1',checked:true},
{title:'tab2',checked:false},
{title:'tab3',checked:false},
{title:'tab4',checked:false},
{title:'tab5',checked:false},
{title:'tab6',checked:false},
],
//右侧内容
contList:[
{cont:'tab1'},
{cont:'tab2'},
{cont:'tab3'},
{cont:'tab4'},
{cont:'tab5'},
{cont:'tab6'},
],
},
//循环切换
forTab(index){
letlens=this.data.tabList.length;
let_id='t'+index;
for(leti=0;ithis.data.current){//向上拉动屏幕
this.setData({current:progress});
this.forTab(this.data.current);
}elseif(progress==this.data.current){
returnfalse;
}else{//向下拉动屏幕
this.setData({
current:progress==0?0:progress--
});
this.forTab(progress);
}
},
onLoad:function(options){
console.log(this.data.tabList)
//框架尺寸设置
wx.getSystemInfo({
success:(options)=>{
varwd=options.screenWidth;//页面宽度
varht=options.windowHeight;//页面高度
this.setData({wd:wd,ht:ht})
}
});
},
onShow:function(){
//初始化状态
this.setData({
toView:'t'+this.data.current,
toViewRt:'t'+this.data.current
})
},
})
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。