uniProject/components/MtaTabBar/MtaTabBar.vue

<template>
  <view class="dljt-tab-bar-box">
	  <!-- active -->
    <view class="bar-item" v-for="(item, index) in tabList" :key="index" 
	@click="switchTab(item)" :class="{active: activeIndex === index}">
      <icon :class="item.icon"></icon>
      <text>{{ item.text }}</text>
    </view>
  </view>
</template>

<script setup>
	const tabList = [
		{text: '首页',pagePath: '/pages/index/index', icon: 'sy-cion', selectedIcon: ''},
		{text: '校园动态',pagePath: '/pages/dqgzDangjiangongzuo/dqgzDangjiangongzuo', icon: 'xydt-cion', selectedIcon: ''},
		{text: '招生就业',pagePath: '/pages/zsjyZhaoshengjianzhang/zsjyZhaoshengjianzhang', icon: 'zsjy-cion', selectedIcon: ''}, 
		{text: '联系方式',pagePath: '/pages/xygkLianxifangshi/xygkLianxifangshi', icon: 'lxfs-cion', selectedIcon: ''}
		]
	const props = defineProps({
		activeIndex: {
			type: String
		}
	})
	
	function switchTab(item) {
		console.log('item', item)
		 uni.reLaunch({ url: item.pagePath });
	}
</script>

<style>

</style>