<template>
<div class="tabheader">
    <ul class="nav nav-tabs">
        <li class="{{$index==active?'active':''}}" v-for="row in rows" @click="click($index)" >
        	<a href="javascript:">{{row.name}}</a>
        </li>
    </ul>
</div>
</template>
<script>
	export default {
		props:{
			rows:{
				type:Array,
				default:[]
			},
		    active: {
		      type: Number,
		      default: -1
		    }
		},
		methods: {
	      click: function (inIndex) {
	        this.rows.map(function (row) {
	          row.active = false;
	        });
	        this.rows[inIndex].active = true;
	        this.active = inIndex;
	        // this.$dispatch('active', inIndex);
	      }
	    }
	}
</script>
<style>
	.tabheader{
		font-family: 'microsoft yahei';
	}
</style>