Browse Source

tab默认第二个页面

dev_230517
zhangzhiyi 2 years ago
parent
commit
55e1f2ddfa
  1. 22
      src/view/tabs/home-screen.vue
  2. 3
      src/view/tabs/tabs.vue

22
src/view/tabs/home-screen.vue

@ -17,7 +17,7 @@ @@ -17,7 +17,7 @@
<div class="message">
<img src="@/assets/imgs/home-screen/message@2x.png" class="message-img" @click="goMessagePage()">
<!-- 消息数量提醒 -->
<div></div>
<div class="message-confim" v-show="messageNum > 0">{{ messageNum }}</div>
</div>
<div class="backups">
<img src="@/assets/imgs/home-screen/backups@2x.png" class="backups-img">
@ -45,7 +45,7 @@ const minutes = ref('--'); @@ -45,7 +45,7 @@ const minutes = ref('--');
/** 获取时间的定时器 */
const getTimeTimer = ref();
/** 信息的数量 */
const messageNum = ref(0);
const messageNum = ref(1);
onMounted(() => {
imgs.value = document.getElementById('imgs');
@ -156,8 +156,24 @@ const goMessagePage = () => { @@ -156,8 +156,24 @@ const goMessagePage = () => {
height: 72px;
}
.message-img {
.message {
margin-right: 34px;
position: relative;
.message-confim {
position: absolute;
top: -5px;
right: -5px;
width: 30px;
height: 30px;
border-radius: 50%;
background-color: #D65659;
display: flex;
align-items: center;
justify-content: center;
color: #FFF;
font-size: 20px;
}
}
}
}

3
src/view/tabs/tabs.vue

@ -82,7 +82,8 @@ const initSwiper = () => { @@ -82,7 +82,8 @@ const initSwiper = () => {
}, //
touchStartPreventDefault: false,
effect: "fade", //
resistanceRatio: 0
resistanceRatio: 0,
initialSlide: 1, //
});
};

Loading…
Cancel
Save