vue多页面路由相互跳转问题?

发布于 2022-09-11 17:57:48 字数 1231 浏览 27 评论 0

由于业务需要,需要使用到多页面,最近在多页面中路由跳转遇到了一个问题:
1、有index.html、exchange.html两个模板文件,分别对应两个入口,vue.config.js配置如下

// 配置多页面入口
  pages: {
    index: {
      entry: 'src/main.js',
      template: 'public/index.html',
      filename: 'index.html',
      title: 'Index Page',
      chunks: ['chunk-vendors', 'chunk-common', 'index']
    },
    exchange: {
      entry: 'src/exchange_main.js',
      title: 'exchange page',
      template: 'public/exchange.html',
      filename: 'exchange.html',
    }
  },

2、index入口对应的路由访问地址为:http://localhost:8088/#/xxx
exchange入口对应的路由访问地址为:http://localhost:8088/exchange.html#/xxx
3、问题来了,当我在http://localhost:8088/exchange.html#/xxx页面中需要回到http://localhost:8088/#/xxx页面时,使用<router-link>组件来访问就变成这样了:
图片描述

http://localhost:8088/exchange.html#/exchange中我想回到首页,于是路由这样写:
<router-link to="/home">首页</router-link>,然后就变成上面这样了,这就导致我不能正确的回到首页。
我现在的做法是使用a标签来进行访问,如:<a href="http://localhost:8088/#/home">首页</a>,但如果页面中有很多要跳转的地方那就很麻烦了

请问各位大神有没有更好的办法呢?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(4

戏剧牡丹亭 2022-09-18 17:57:48

可以自己写一个组件类似routerlink 参数一个to,就和routerlonk传的一样,然后多写一个,比如传个index 或者exchange

鹿港巷口少年归 2022-09-18 17:57:48

你好,我也做的vue多页面应用,两个.html页面都可以访问,但分页面之后html下的路由没法跳转,请问你用的什么方法

靖瑶 2022-09-18 17:57:48

可以用 nginx 代理请求。

我不在是我 2022-09-18 17:57:48

VUE本来就是单页应用,如果要多应用之间跳转 可以用原始方法

跳转window.location.href = '/exchange.html#/exchange'

觉得麻烦 就自己写个组件 <index-link /> 不过内部方法 还是window.location.href 只是包装的好看些

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文