fecrprd/components/v-tab/v-tab.vue

44 lines
747 B
Vue

<template>
<view class="v-tab">
<view :class="index===selectIndex?'action':''" v-for="(item,index) in data" :key="index"
@click="selectIndex=index,$emit('select',index)">
{{item.name}}
</view>
</view>
</template>
<script>
export default {
name: "vTab",
data() {
return {
};
},
props: {
data: [Array],
selectIndex:[Number]
},
}
</script>
<style lang="scss">
.v-tab {
height: 80upx;
line-height: 80upx;
color: $uni-text-color;
background: white;
box-shadow: 0 2upx 5upx $uni-bg-color-grey;
display: flex;
justify-content: space-around;
align-items: stretch;
font-size: $uni-font-size-base;
.action {
font-weight: bold;
border-bottom: 4upx solid $uni-color-primary;
}
}
</style>