split_array=(arr,len)=>{
let arr_length = arr.length;
let newArr = [];
for(let i=0;i<arr_length;i+=len){
newArr.push(arr.slice(i,i+len));
}
return newArr;
}
let data = ['赵','钱','孙','李','周','吴'];
let result = split_array(data, 3);getCate() {
let that = this;
getCates('mallshop', function(cates) {
let arr = [];
for (var i = 0; i < cates.length; i += 10) {
arr.push(cates.slice(i, i + 10))
}
that.tabInfo = arr;
})
},<swiper class="tab-swiper mb" :indicator-dots="false" v-if="tabInfo.length" :style="{height:(tabInfo[0].length>5?'320rpx':'160rpx')}">
<block v-for="(list,idx) in tabInfo" :key='idx'>
<swiper-item>
<view class="tab">
<view class="tabBox">
<view class="options" v-for="(item,index) in list" :key='index' @click="goRouter('mall/cate?name='+item.name)">
<easy-loadimage :scroll-top="scrollTop" :image-src="item.image"></easy-loadimage>
<view class="txt">{{item.name}}</view>
</view>
</view>
</view>
</swiper-item>
</block>
</swiper>.tab-swiper {
width: 100%;
height: 360rpx;
.tab {
width: 100%;
.tabBox {
width: 100%;
display: flex;
justify-content: flex-start;
flex-wrap: wrap;
.options {
width: 120rpx;
margin: 24rpx 37.5rpx 24rpx 0;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
&:nth-child(5n) {
margin-right: 0rpx;
}
.icon,
/deep/.easy-loadimage {
width: 88rpx;
height: 88rpx;
border-radius: 50%;
overflow: hidden;
}
.txt {
font-size: 24rpx;
font-family: PingFang-SC-Medium,
PingFang-SC;
font-weight: 500;
color: rgba(50, 50, 50, 1);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
}
}
}
