tabs组件添加未读状态显示

This commit is contained in:
wangxiaowei 2024-08-28 22:46:03 +08:00
parent 8a35088446
commit 6d294f618b
2 changed files with 9 additions and 9 deletions

@ -13,6 +13,9 @@
name: {
type: [Number, String],
value: ''
},
num: {
type: Number,
}
},
inject: ['tabs'],
@ -56,10 +59,12 @@
changeData() {
const {
dot,
num,
info,
} = this
return {
dot,
num,
info,
}
}

@ -12,8 +12,8 @@
<view class="scroll-box" :class="{'tabs-scorll-flex': !isScroll}">
<view class="tab-item line1" :id="'tab-item-' + index" v-for="(item, index) in list"
:key="index" @tap="clickTab(index)" :style="[tabItemStyle(index)]">
<u-badge :count="item[count] || item['dot'] || 0" :offset="offset" size="mini" class="badge"></u-badge>
{{ item[name] || item['name']}}
<u-badge :count="item[count] || item['dot'] || item['num'] || 0" :offset="offset" size="mini" class="badge"></u-badge>
{{item[name] || item['name']}}
</view>
<view v-if="showBar" class="tab-bar" :style="[tabBarStyle]"></view>
</view>
@ -233,6 +233,7 @@
const {
name,
dot,
num,
active,
inited,
updateRender
@ -240,6 +241,7 @@
return {
name,
dot,
num,
active,
inited,
updateRender
@ -376,11 +378,4 @@
display: flex;
justify-content: space-between;
}
.badge {
position: absolute;
top: 8rpx;
left: 80%;
transform: translateX(-80%);
}
</style>