這是我的代碼<div class="menu-parent" v-for = "item in menu" :class="parentColor"> <p v-text="item.name" class="top-title" @click="toggleShow($index)"></p> <ul v-show="menu[$index].child" class="menu-child"> <li v-for="items in item.child" @click="childCheck($index)" > <a v-text="items.name" :class="shoope"></a> </li> </ul></div><script>import Menu from '../../libs/menu';export default { data () { return { msg: '登錄之后的主頁面', menu:[], shoope:false, ishow:false, i:-1, parentColor:false } }, ready(){ this.menu = Menu.menu; }, methods:{ toggleShow:function($index){ $('.menu-parent >ul').eq($index).slideToggle(500); }, childCheck:function($index){ $('ul li').eq($index).children('a').addClass('childclick'); } }}</script><style>.childclick{ background: #FFFFFF; color: #4E8CEE;}.parentclick{ background: #C0CFE0; color: #6684B5;}</style>設(shè)計(jì)圖是這樣的求各位大神指教
如何用vue實(shí)現(xiàn)二級(jí)菜單欄
jeck貓
2018-10-10 13:11:12