Question

我有一个带有一些链接的主导航导航栏。在主页中，即在根路径（'/'）中，我有嵌套（子）路由。

路线配置：

const routes = [
    {path: '/', component: HomeMainContent, children: [
            {path: '', component: MovieList},
            {path: 'in-theaters', component: MovieList},
            {path: 'coming-soon', component: ComingSoonList},
            {path: 'trailers', component: TrailerList},
    ]},
    {path: '/about', component: About},
    {path: '/contact',component: Contact},
];

因此，当根路径('/')处于活动状态时，其子路由器根路径('')将被激活。

子组件路由器的模板是这样的：

<template>
    <div id="homeSubMenuWrapper">
        <ul id="subMenuList">
            <li v-for="menu in menuList">
                <router-link class="menuItem" :to="menu.path">{{menu.name}}</router-link>
            </li>
        </ul>
    </div>
</template>

<script>
    export default {
        data() {
            return {
                menuList: [
                    {name: 'IN THEATER', path: '/in-theaters'},
                    {name: 'COMING SOON', path: '/coming-soon'},
                    {name: 'TRAILERS', path: '/trailers'},
                ]
            }
        }
    }
</script>

因为路径('')和（'in-theaters')都有相同的组件，我想让路径('in-theaters')的路由器链接具有{{1}的类每当其父路径router-link-active的子路径('')处于活动状态时。我该怎么做？

这意味着只要子路径路径为空路径('/')，第一个子路由('in-theaters')就应该具有活动类。

Answer 1

根据@ Potray的建议，我最终检查了$ route.path和模板中的子路径。

from future.utils import bytes_to_native_str

__pkgdata__ = {bytes_to_native_str(b'daysgrounded'): ['*.txt']}

每当子路径路径为空路径时，将第一个子路由作为活动类

1 个答案: