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

<template>
	<view class="phone-custom-tabbar">
			<!-- <view class="tabbar-item" v-for="(item, index) in tabList" :key="index" @click="switchTab(item.path,index)"
				:style="{ backgroundImage: 'url(' + (currentTab == index ? item.activePath : item.iconPath) + ')' }">
			</view> -->
			<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 {
		data() {
			return {
				/* 		tabList: [{
								iconPath: 'static/images/tabbar/unselect/plan-sj.png',
								activePath: 'static/images/tabbar/select/plan-sj.png',
								path: `/pages/study/index`
							},
							{
								iconPath: 'static/images/tabbar/unselect/partner-sj.png',
								activePath: 'static/images/tabbar/select/partner-sj.png',
								path: '/pages/game/index'
							},
							{
								iconPath: 'static/images/tabbar/unselect/my-sj.png',
								activePath: 'static/images/tabbar/select/my-sj.png',
								path: `/pages/my/index`
							},
						], */
				tabList: [{
						text: '首页',
						path: `/pages/study/index`,
						iconPath: getStaticUrl('static/images/tabbar/unselect/index-icon.png'),
						activePath: getStaticUrl('static/images/tabbar/select/index-icon.png'),
					},
					{
						text: '家政',
						path: '/pages/game/index',
						iconPath: getStaticUrl('static/images/tabbar/unselect/jz-icon.png'),
						activePath: getStaticUrl('static/images/tabbar/select/jz-icon.png'),
					},
					{
						text: '我的',
						path: `/pages/my/index`,
						iconPath: getStaticUrl('static/images/tabbar/unselect/my-icon.png'),
						activePath: getStaticUrl('static/images/tabbar/select/my-icon.png'),
					},
				],
				currentTab: 0,
			};
		},
		methods: {
			switchTab(path, index) {
				uni.redirectTo({
					url: path
				});
				/* uni.navigateTo({
					url: path,
					"animationType": "fade-in",
					"animationDuration":0
				}); */
			},

		},
		created() {

			this.currentTab = this.currentTabNumber
		}
	}
</script>


<style scoped>
	.tabbar-item-box {
		display: flex;
		justify-content: space-around;
		align-items: center;
		height: 60px;
		line-height: 60px;
		/* 其他样式 */
	}

	.tab-item {
		flex: 1;
		/* 样式 */
	}

	.tab-icon {
		/* 图标样式 */
	}
</style>