<style>
li{list-style:none;display: inline-block;padding:10px;}
.gradient{background:grey;}
.active{background:red;}
</style>
<script src="vue.js"></script>
<script>
window.onload = function(){
var menuBar = new Vue({
el:'#menu',
data:{
choices:[
{selected:'搜店'},
{selected:'地址'},
{selected:'优惠券'},
{selected:'全文'},
{selected:'视频'}
],
activeMenu:''
},
methods:{
activeBar:function(item){
this.activeMenu = item
}
}
});
}
</script>
<ul class="menu" id="menu">
<li class="gradient" v-for="item in choices" v-on:click="activeBar(item)" :class="{active: activeMenu == item}" >{{item.selected}}</li>
我想初始化第一個li是active,是用v-if判斷嗎還是?
学习是最好的投资!