tabBar.vue 1.17 KB
<template>
	<view class="tab-bar">
		<u-tabbar :value="currentPagePath" activeColor="#EC5D12" zIndex="100" :fixed="true" :placeholder="true"
			:safeAreaInsetBottom="true">
			<u-tabbar-item v-for="(item,index) in tabBarList" :key="index" :text="item.text"
				:icon="item.pagePath === currentPagePath ? item.selectedIconPath : item.iconPath" :name="item.pagePath"
				@click="click_page(item.pagePath)" />
		</u-tabbar>
	</view>
</template>

<script>
	import {
		mapGetters
	} from 'vuex'

	export default {
		name: 'tabBar',
		props: {
			currentPagePath: String,
		},
		data() {
			return {}
		},
		computed: {
			...mapGetters([
				'tabBarList'
			])
		},
		created() {
			// #ifndef MP-WEIXIN
				uni.hideTabBar();
			// #endif
		},
		mounted() {
			// #ifndef MP-WEIXIN
				uni.hideTabBar();
			// #endif
			console.log('tabBarList', this.tabBarList)
		},
		methods: {
			click_page(arg) {
				let page = '/' + arg
				console.log(page);
				uni.setStorageSync('orderCardType', '');
				uni.switchTab({
					url: page
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	.tab-bar {
		::v-deep {
			.u-icon__img {
				height: 25px !important;
				width: 25px !important;
			}
		}
	}
</style>