首页 > 解决方案 > 通过给定的浏览器 URL 在启动时重定向

问题描述

我创建了一个带有基本路径的新 Vue 应用程序。由于该应用程序嵌入到另一个 Vue 应用程序中,因此该应用程序不会router-view在启动时呈现。如果您想了解更多有关此应用程序如何或为何嵌入到另一个应用程序的信息,请查看此处:

将 Vue 应用程序挂载到主 Vue 应用程序的容器中

以及我自己对这个问题的回答:

https://stackoverflow.com/a/58265830/9945420

启动我的应用程序时,它会呈现除router-view. 我想在启动时通过给定的浏览器 URL 重定向。这是我的路由器配置:

import Vue from 'vue';
import Router from 'vue-router';

import One from './views/One.vue';
import Two from './views/Two.vue';

Vue.use(Router);

const router = new Router({
    base: '/my-embedded-app/',
    mode: 'history',
    routes: [
        {
            path: '/',
            component: One,
        },
        {
            path: '/two',
            component: Two,
        },
    ],
});

router.replace(router.currentRoute.fullPath);

export default router;

我希望应用程序调用.../my-embedded-app/two. 不幸的是,router.replace总是重定向到/(所以浏览器 URL 是.../my-embedded-app/)。我调试了router,看到路径是/,但我希望它是/two

重要提示: 我不想将用户重定向到/twourl 为/. 我只想Two在 url 为/two. 目前没有。

可能有什么问题?也许我什至不需要那个重定向,并且可以以更优雅的方式解决问题。

标签: javascriptvue.jsvuejs2vue-router

解决方案


这是正常行为,这是单页应用程序的工作方式。“磅” - 像 # - 符号表示链接不会将应用程序移动到另一个页面。

所以你可以将路由器模式更改为

mode:"hash"

推荐阅读