代码
<template>
<view class="container">
<view class="title"> 沈阳一mast平台好呢哦啊是大卡 </view>
<view class="top-box flex-between">
<view class="top-left">
<view class="left-t">沈阳市</view>
<view class="left-b">本月共12起诉求</view>
</view>
<view class="top-right flex-between">
<view class="right-item " v-for="item of 3">
<view class="item-t">专卖</view>
<view class="item-b">6</view>
</view>
</view>
</view>
<view class="swiper-box">
<u-tabs :list="list1" @click="click"></u-tabs>
</view>
</view>
</template>
<script>
export default {
data() {
return {
list1: [{
name: '待处理',
}, {
name: '处理中',
}, {
name: '已办结'
}]
}
},
methods:{
click(){
}
}
}
</script>
<style lang="scss" scoped>
.container {
.title {}
.top-box {
margin-top: 100rpx;
.top-left {
.left-t {}
.left-b {}
}
.top-right {
.right-item {
.item-t {}
.item-b {}
}
}
}
.flex-between {
display: flex;
justify-content: space-between;
align-items: center;
}
}
::v-deep .u-tabs__wrapper__nav[data-v-48634e29] {
display: flex;
flex-direction: row;
position: relative;
justify-content: space-between;
}
//选中蓝色滑块对应
::v-deep .u-tabs__wrapper__nav__item {
flex: 1 1 0% !important;
}
</style>
复制粘贴这段代码即可