jp-xpgj-GA-file/src/projects/business/components/NavMenu.vue

<template>
	<nav class="mui-bar mui-bar-tab">
		<router-link :to="router[0]" :class="'mui-tab-item '+(routeName==router[0]['name']?'mui-active':'')">
			<span class="mui-icon iconfont icon-shouye2"></span>
			<span class="mui-tab-label">首页</span>
		</router-link>
		<router-link :to="router[1]" :class="'mui-tab-item '+(routeName==router[1]['name']?'mui-active':'')">
			<span class="mui-icon iconfont icon-xiaoxi1"></span>
			<span class="mui-tab-label">消息</span>
		</router-link>
		<router-link :to="router[2]" :class="'mui-tab-item '+(routeName==router[2]['name']?'mui-active':'')">
			<span class="mui-icon iconfont icon-wode1"></span>
			<span class="mui-tab-label">我的</span>
		</router-link>
	</nav>
</template>

<script>
	export default {
		name: 'NavMenu',
		props: {
			visible: {
				require: false,
				default: true,
			},
			router: {
				require: true,
				type: Array,
				default: [{
					name: 'Home'
				}, {
					name: 'Home'
				}, {
					name: 'Home'
				}],
			},
		},
		created() {
			console.log(this.$route);
		},
		methods: {},
		mounted() {},
		computed: {
			routeName: {
				// getter
				get: function() {
					return this.$route.name;
				},
				// setter
				set: function(newValue) {
					console.log(newValue)
				}
			},
		}
	}
</script>

<style src="$project/assets/css/iconfont.css"></style>
<style scoped>
</style>