选项卡切换小例子

选项卡切换，选中就是高亮

<template>
	<div>
		<!--1.标题排他，2.绑定菜单单击事件，传递参数 -->

			<span :class="{active:isactive==0}" @click="mytab(0)">娱乐新闻,</span>
			<span :class="{active:isactive==1}" @click="mytab(1)">体育新闻,</span>
			<span :class="{active:isactive==2}" @click="mytab(2)">热搜</span>
			<div>
				<span v-for="(item,i) in newlist[isactive]" :key="i">{{item}}</span>
			</div>

	</div>
</template>

<script>
	export default{
		data(){
			return{
				isactive:0,
				newlist:[
					["娱乐新闻1","娱乐新闻2","娱乐新闻3"],
					["八卦新闻1","八卦新闻2","八卦新闻3"],
					["热搜1","热搜2","热搜3"],
				]
			}
		},
		methods:{
			// 接收参数，给isactive赋值
			mytab(i){
				this.isactive=i;
			}
		}
	}
</script>

<style scoped>
	.active{
		
			color: green;
		
	}
	</style>