时间戳

首页 > 解决方案 > Vue3编程路由在chrome中不起作用

javascript - Vue3编程路由在chrome中不起作用

问题描述

程序化路由在 Chrome（版本 88.0.4324.182）中似乎无法正常工作。我有一个简单的应用程序，带有一个返回、前进或重定向到页面的按钮。

包.json：

{
  "name": "vue-3",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build"
  },
  "dependencies": {
    "core-js": "^3.6.5",
    "vue": "^3.0.0",
    "vue-router": "^4.0.0-0"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "~4.5.0",
    "@vue/cli-plugin-router": "~4.5.0",
    "@vue/cli-service": "~4.5.0",
    "@vue/compiler-sfc": "^3.0.0"
  }
}

程序化路由：

export default {
  methods: {
    redirect() {
      return this.$router.push({ name: "About" });
    },
    back() {
      return this.$router.go(-1);
    },
    forward() {
      return this.$router.go(1);
    },
  },
};

back()切换路线后不会返回一个条目。隐身模式下的 Firefox 或 Chrome 会按预期运行。

我做了一个沙箱来演示这个问题。只要应用程序运行嵌入在代码和框中，路由就可以正常工作：https ://codesandbox.io/s/condescending-hoover-2jcpc

如果直接在 Chrome 中打开应用程序，它可能会不起作用：https ://2jcpc.csb.app/

有人可以确认这一点还是有解决方案？

标签： javascriptvue.jsvue-router

解决方案

推荐阅读