vue 三级控制

1、html代码

<div id="app" class="container">
        <div class="heade-box">
            <div class="header">
                <img src="images/logo.png" height="110" width="312">
                <ul class="header-cont">
                    <li v-for="one in menu" @click="currentMenu(one)" :class="{liActive:current.title==one.title}">
                        <img :src="one.icon" height="26" width="26">
                        <p>{
   {
   one.title||''}}</p>
                    </li>
                </ul>
                <div class="header-right">
                    <p class="header-touxiang">
                        <img src="images/touxiang.png" height="36" width="36">
                        <span>管理员</span>
                    </p>
                    <p class="header-back">
                        <a href="###">退出</a>
                    </p>
                </div>
            </div>
        </div>
        <ul class="subnav" v-if="current.childs&&current.childs.length>0">
            <li v-for="two in current.childs" @click="currentSecMenu(two)" :class="{subActive:two.title==currentTow.title}">
                <span>{
   {
   two.title||''}}</span>
                <img v-if="two.title==currentTow.title" src="images/arrowTop.png" height="7" width="14">
            </li>
        </ul>
        <div class="content" v-if="currentTow.childs&&currentTow.childs.length>0">
            <div class="content-left">
                <ul class="contentLeft-title">
                    <li v-for="three in currentTow.childs" @click="currentThree=three" :class="{leftActive:three.title==currentThree.title}">
                        <a :class="{leftHref:three.title==currentThree.title}" target="iframe" :href="three.href">
                            <b :class<