vue TAB切换

HTML部分：

<template>
  <div class="tab">
	<div :class="{isTab:true,current:isTabIndex == index}" v-for="(item,index) in tabList" @click="clickTab(index)">{{item}}</div>
  </div>
</template>

CSS部分：

<style scoped>
	.tab {
		width: 100%;
		height: 50px;
		background: #fff;
		border: 1px solid #eee
	}
	.isTab {
		width: 20%;
		float: left;
		text-align: center;
		line-height: 50px;
		font-size: 16px;
	}
	.isTab.current {
		width: 20%;
		border-bottom: 2px solid #ef5e25;
		font-size: 16px;
		color: #ef5e25;
	}
</style>

JS部分：

<script>
	export default {
		data() {
			return {
			   	tabList:['新品','热销','精品','推荐','排行'],
			   	isTab:true,
			   	isTabIndex:0
			}
		},
		methods: {
			clickTab:function(e){
				this.isTabIndex = e;
			}
		}
	}
</script>