导航逻辑修改

whychdw

2019-07-22 51c1ddd948c2c368376cea0d34791df9a33e27b3

 src/components/MainMenu.vue

@@ -17,12 +17,12 @@
                :class="{'show-this':menu.subShow, 'show-this-hover':menu.subShowHover}">
                <ul>
                    <li v-for="(children, sKey) in menu.childrens" :key="sKey">
                        <a 
                            :href="children.url" 
                        <router-link
                            :to="children.url" 
                            :class="{active: children.active}"
                            @click="subClick(key, sKey)">
                            @click.native="subClick(key, sKey)">
                            {{children.txt}}
                        </a>
                        </router-link>
                    </li>
                </ul>
            </div>
@@ -48,12 +48,12 @@
                    childrens: [
                        {
                            txt: '状态信息',
                            url: '#',
                            url: '/home/state',
                            active: true
                        },
                        {
                            txt: '账户信息',
                            url: '#',
                            url: '/home/account',
                            active: false
                        },
                        {
@@ -251,9 +251,33 @@
            menu.subShow = true;
            menu.active = true;
            children.active = true;
        },
        setMenuState: function(path) {
            var key = 0;
            var skey = 0;
            // 遍历menu的值
            for(var i=0; i<this.menus.length; i++) {
                var menu = this.menus[i];
                var childrens = menu.childrens;
                for(var k=0; k<childrens.length; k++){
                    var children = childrens[k];
                    if(children.url != '#' && children.url == path) {
                        key = i;
                        skey = k;
        }
    }
}

            this.subClick(key, skey);
        }
    },
    mounted: function() {
        var path = this.$route.path;
        var store = this.$store;
        // 根据路由设置导航状态
        this.setMenuState(store.state.path);
    }
}
</script>
<style scoped>
    .main-menu {