<scroll-view class="tabs-scroll-view" :scroll-x="scrollable" :show-scrollbar="false"
:scroll-left="tabsScrollLeft" :scroll-with-animation="true" @scroll="scroll">
<view class="tabBox">
<block v-for="(item,index) in list" :key="index">
<view class="snake-font-dinmedium" :class="['tabTopItem', lineShow ? tabsCurrent === index ? 'active' : '' : ''] "
:style="[{flex: scrollable ? '' : 1}, itemStyle, tabsCurrent === index ? activeStyle : inactiveStyle]"
@click="tabsChange(item,index)">
{{item.name || item.label || item}}
</view>
</block>
</view>
</scroll-view>样式如下:
.tabBox {
width: 100%;
display: flex;
flex-direction: row;
white-space: nowrap;
position: relative;
}
