workApp/components/page-tabbar.vue

<template>
	<uv-tabbar :value="tabBarValue" activeColor="#2E64FA" inactiveColor="#C7CBD6" @change="changeTabBarValue">
		<uv-tabbar-item v-for="item in tabBarList" :key="item.pathName" :name="item.pathName" :text="item.text">
			<template v-slot:active-icon>
				<image class="icon" :src="item.selectedIconPath" style="width:48rpx;height:48rpx"></image>
			</template>
			<template v-slot:inactive-icon>
				<image class="icon" :src="item.iconPath" style="width:48rpx;height:48rpx"></image>
			</template>
		</uv-tabbar-item>
	</uv-tabbar>
</template>

<script setup>
	import uvTabbar from '@/uni_modules/uv-tabbar/components/uv-tabbar/uv-tabbar.vue';
	import uvTabbarItem from '@/uni_modules/uv-tabbar/components/uv-tabbar-item/uv-tabbar-item.vue';
	import { reactive } from 'vue';
	const emit = defineEmits(['ChangeTabBarValue']);
	const props = defineProps({
		tabBarValue: {//默认选中的tab
			type: String,
			default: () => ''
		},
		tabBarList: {
			type: Array,
			default: () => []
		}
	});
	const state = reactive({
	})
	//切换tabBar
	const changeTabBarValue = (name) => {
		emit('ChangeTabBarValue',name)
	}
	
</script>