mobileclient/v1_5_0_C/tabbar.js

64 lines
1.5 KiB
JavaScript
Raw Normal View History

2022-09-21 18:35:54 +08:00
const tabComponent = {
2022-09-21 17:30:39 +08:00
template: `
2022-09-26 15:51:36 +08:00
<ul class="tabList"
2022-09-27 10:31:52 +08:00
v-if="tabData.iswitch==='1'&&isSwitchCount>1"
2022-09-26 15:51:36 +08:00
:style="{background:(tabData.background?'url('+tabData.background+')':'#fff'),backgroundSize:'100% 100%'}"
>
<template v-for="item in list">
<li
:key="item.id"
v-if="item.iswitch==='1'"
@click='iconHandler(item)'
:style="{color:(current===item.id?tabData.selectText:tabData.defaultText)}"
>
<img :src="current===item.id?item.pic?.selectShow:item.pic?.show" alt="">
<p>{{item.text}}</p>
</li>
</template>
2022-09-21 18:35:54 +08:00
</ul>`,
2022-09-23 11:48:51 +08:00
data() {
return {
2022-09-26 15:51:36 +08:00
tabData: {},
2022-09-27 10:31:52 +08:00
list: [],
isSwitchCount: 1
2022-09-23 11:48:51 +08:00
}
},
2022-09-21 18:35:54 +08:00
props: {
/* tab选中下标 */
2022-09-21 18:35:54 +08:00
current: {
type: Number,
default: 1
2022-09-21 17:30:39 +08:00
}
2022-09-21 18:35:54 +08:00
},
2022-09-23 11:48:51 +08:00
methods: {
/* 根据不同icon进行跳转 */
iconHandler(item) {
window.location.replace(item.link)
2022-09-21 18:35:54 +08:00
}
2022-09-26 15:51:36 +08:00
},
mounted() {
let { bottomBar } = JSON.parse(sessionStorage.getItem("product_list"))
this.tabData = bottomBar
bottomBar.navlist.map((item) => {
2022-09-27 10:31:52 +08:00
if (item.iswitch === "1") {
this.isSwitchCount++
}
2022-09-26 15:51:36 +08:00
item.id = Number(item.id)
if (item.id === 1) {
item.link = "./couponCollection.html"
}
if (item.id === 2) {
item.link = "./myOrder.html"
}
if (item.id === 3) {
item.link = "./myCoupon.html"
}
})
this.list = bottomBar.navlist
2022-09-21 17:30:39 +08:00
}
2022-09-21 18:35:54 +08:00
}