69 lines
2.4 KiB
Vue
69 lines
2.4 KiB
Vue
<template>
|
|
<u-tabbar :value="name" :fixed="true" :border="false" activeColor="#01BE69" zIndex="50" inactiveColor="#999" :safeAreaInsetBottom="true" :placeholder="placeholder">
|
|
<u-tabbar-item :text="item.text" @click="swtichTab(item.path)" :name="item.name" v-for="(item, index) in tabList" :key="index">
|
|
<image slot="active-icon" style="width: 40rpx; height: 40rpx;" :src="item.selectIconPath"></image>
|
|
<image slot="inactive-icon" style="width: 40rpx; height: 40rpx;" :src="item.iconPath"></image>
|
|
</u-tabbar-item>
|
|
</u-tabbar>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
props: {
|
|
name: {
|
|
type: String,
|
|
default: ''
|
|
},
|
|
placeholder: {
|
|
type: Boolean,
|
|
default: true
|
|
}
|
|
},
|
|
data () {
|
|
return {
|
|
tabList:[
|
|
{
|
|
iconPath: '/static/image/tabbar/home.png',
|
|
path: '/pages/tabbar/home',
|
|
selectIconPath: '/static/image/tabbar/homeActive.png',
|
|
text: '首页',
|
|
name: 'home'
|
|
},
|
|
{
|
|
iconPath: '/static/image/tabbar/ticketing.png',
|
|
path: '/pages/tabbar/ticketing',
|
|
selectIconPath: '/static/image/tabbar/ticketingActive.png',
|
|
text: '购票',
|
|
name: 'ticketing'
|
|
},
|
|
// {
|
|
// iconPath: '/static/image/tabbar/ticketing.png',
|
|
// path: '/pages/shop/list',
|
|
// selectIconPath: '/static/image/tabbar/ticketingActive.png',
|
|
// text: '商城',
|
|
// name: 'shop'
|
|
// },
|
|
{
|
|
iconPath: '/static/image/tabbar/guide.png',
|
|
path: '/pages/tabbar/guide',
|
|
selectIconPath: '/static/image/tabbar/guideActive.png',
|
|
text: '导览',
|
|
name: 'guide'
|
|
},
|
|
{
|
|
iconPath: '/static/image/tabbar/mine.png',
|
|
path: '/pages/tabbar/mine',
|
|
selectIconPath: '/static/image/tabbar/mineActive.png',
|
|
text: '我的',
|
|
name: 'mine'
|
|
}
|
|
]
|
|
}
|
|
},
|
|
methods:{
|
|
swtichTab(url) {
|
|
uni.reLaunch({ url })
|
|
}
|
|
}
|
|
}
|
|
</script> |