uniProject/components/custom-tabbar/custom-tabbar-client.vue

<template>
	<view class="phone-client-tabbar">
		<view class="tabbar-item" v-for="(item, index) in tabList" :key="index" @click="switchTab(item.path,index)">
			<icon class="tabbar-item-icon" :style="{ backgroundImage: 'url(' + (currentTab == index ? item.activePath : item.iconPath) + ')' }"></icon>
			<text class="tabbar-item-text">{{item.text}}</text>
		</view>
	</view>
</template>

<script>
	import {getStaticUrl} from '@/utils/common.js';
	import {
		useTabBarHistory
	} from '@/utils/emitEvents.js';
	import cacheManager from "@/utils/cacheManager.js";
	export default {
		props: {
			currentTab: {
				type: Number,
			}
		},
		data() {
			return {
				tabList: [{
						text: '首页',
						path: `/pages/client/ShouYe/shouye`,
						iconPath: getStaticUrl('static/images/tabbar/unselect/client-jz-icon.png'),
						activePath: getStaticUrl('static/images/tabbar/select/client-jz-icon.png'),
					},
					{
						text: '我的',
						path: `/pages/client/my/index`,
						iconPath: getStaticUrl('static/images/tabbar/unselect/client-my-icon.png'),
						activePath: getStaticUrl('static/images/tabbar/select/client-my-icon.png'),
					},
				],
			};
		},
		methods: {
			switchTab(path, index) {
				if (index == this.currentTab) {
					// 同页面不刷新
					return;
				}
				uni.navigateTo({url: path});
			},
		},
	}
</script>