TraceabilityAPP/components/customTabbar/tabbar.vue

<template>

	<u-tabbar :value="value1" :fixed="true" :placeholder="false" :safeAreaInsetBottom="true">
		<u-tabbar-item @click="click1">
			<template #active-icon>
				<image class="u-page__item__slot-icon" src="/static/tabs-icon/sydj.png"
					style="width: 60rpx;height: 60rpx;"></image>
			</template>
			<template #inactive-icon>
				<image class="u-page__item__slot-icon" src="/static/tabs-icon/sy.png"
					style="width: 60rpx;height: 60rpx;"></image>
			</template>


		</u-tabbar-item>
		<u-tabbar-item @click="click1">
			<template #active-icon>
				<image class="u-page__item__slot-icon" src="/static/tabs-icon/dkdj.png"
					style="width: 60rpx;height: 60rpx;"></image>
			</template>
			<template #inactive-icon>
				<image class="u-page__item__slot-icon" src="/static/tabs-icon/dk.png"
					style="width: 60rpx;height: 60rpx;"></image>
			</template>


		</u-tabbar-item>
		<u-tabbar-item @click="click1">
			<template #active-icon>
				<image class="u-page__item__slot-icon" src="/static/tabs-icon/wddj.png"
					style="width: 60rpx;height: 60rpx;"></image>
			</template>
			<template #inactive-icon>
				<image class="u-page__item__slot-icon" src="/static/tabs-icon/wd.png"
					style="width: 60rpx;height: 60rpx;"></image>
			</template>

		</u-tabbar-item>
	</u-tabbar>


</template>

<script setup>
	import store from "@/store/index.js"
	import {
		ref
	} from "vue"
	console.log(store.state.tabbrIndex)
	const value1 = ref(store.state.tabbrIndex)
	const click1 = (e) => {

		store.dispatch('changeTabbar', e)
		// console.log(, 454)
		if (e == 0) {
			uni.switchTab({
				url: '/pages/index/massif'
			})
		}
		if (e == 1) {
			uni.switchTab({
				url: '/pages/index/index'
			})
		}
		if (e == 2) {
			uni.switchTab({
				url: '/pages/index/personal'
			})
		}
	}
</script>

<style>
</style>