1. 程式人生 > >vue-tab切換,路由跳轉

vue-tab切換,路由跳轉

<template>
	<p class="st-menu">
		<span v-for="(item,index) in menuList" :class="{selected:index == num}"
		@click="chooseMenu(index)"
		>{{item.label}}</span>
	</p>
</template>

<script>
	export default {
		data() {
			return{
				menuList:[{
					label:123,
					label:456,
					label:789
				}]
			}
		},
		methods:{
			chooseMenu(index) {
				if (index === 0) {
					this.$router.push({
						path:"onlineuser"
					})
				}else if(index === 1) {
						this.$router.push({
							path:"statisticsdata"
						})
					}else if(index === 2) {
						this.$roter.push({
							path:"cloudstorage"
						})
					}
			}
		}
	}
</script>

<style>
	
</style>
<div class="st-wrap">
    <div class="st-menu-wrap">
      <statistics-menu num = 0></statistics-menu>
    </div>
</div>
div class="st-wrap">
    <div class="st-menu-wrap">
      <statistics-menu num = 1></statistics-menu>
    </div>
</div>
<div class="st-wrap">
    <div class="st-menu-wrap">
      <statistics-menu num = 2></statistics-menu>
    </div>
</div>