tabs组件添加未读状态显示
This commit is contained in:
parent
8a35088446
commit
6d294f618b
@ -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>
|
||||
|
||||
Loading…
Reference in New Issue
Block a user