vue.js - 在 VueJS 中传递我的主路由默认值

Question

我的路由器目前看起来像：

export default new Router({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: [
        {
            path: '',
            name: 'home',
            component: Home
        },
        {
            path: '/:set',
            name: 'set',
            component: Set
        },
    ]
})

我希望这实际上看起来像：

export default new Router({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: [
        {
            path: '',
            name: 'home',
            component: Set,
            set: 'set-value-here'
        },
        {
            path: '/:set',
            name: 'set',
            component: Set
        },
    ]
})

变化是 URL 路径仍然是 ''，但我希望它加载组件Set并带有正在编码的 set 变量。

这可能吗？

标签： vue.jsvue-router

Answer 1

据我所知，这是不可能的。但你可以做其他事情。您可以将参数传递给 Home 组件，然后根据参数的值，您可以调用不同的组件。

编辑1：

我猜是这样的：

export default new Router({
    mode: 'history',
    base: process.env.BASE_URL,
    routes: [
        {
            path: '/:set?',
            name: 'home',
            component: Home
        },
    ]
})

在您的 Home 组件中，您可以使用它：

<template>
    <div>
        <div v-if="set === null">
            // Continue Home Component
        </div>
        <div v-else>
            <set-component></set-component>
        </div
    </div>
</template>

and etc...