1、如果是一级导航,划入只展示自己下面的内容可以通过index来进行找到相应的值
HTML:
<div class="class-one" v-for="(nav,index) in customMenus" :key="index">
<span class="oneclass" @mouseover.stop="showOnedDescription(nav,index)" @mouseout.stop ="hideOneDescription()">{{nav.displayText}}</span>
<div class="describe" :class="returnNum === index ? 'oneclassdescrption' : ''"><span v-if="nav.description">{{nav.description}}</span><span v-else>暂无描述信息</span></div>
</div>
CSS:
.oneclassdescrption {
display: block !important;
}
JS:
methods:{
//划入一级导航是否显示描述信息
showOnedDescription : function(nav,index){
// alert("index"+index)
this.classOneNum = index;
return false;
},
//划出隐藏描述信息
hideOneDescription:function(){
this.classOneNum = 999;
}
},
computed:{
returnNum(){
return this.classOneNum
}
}
2、如果是二级导航,划入只展示自己下面的内容可以通过id来进行找到相应的值
书写的内容同上