Vue Router 4.0

新的 history 配置取代 mode

mode: ‘history’ 配置已经被一个更灵活的 history 配置所取代。根据你使用的模式，你必须用适当的函数替换它：

• “history”: createWebHistory()
• “hash”: createWebHashHistory()
• “abstract”: createMemoryHistory()

下面是一个完整的代码段：

import { createRouter, createWebHistory } from 'vue-router'
// 还有 createWebHashHistory 和 createMemoryHistory
 
createRouter({
  history: createWebHistory(),
  routes: [],
})

更多内容可以查看：

• vue&react项目刷新页面出现404的原因以及解决办法

常见问题

• TypeScript 中 RouteRecordRaw 类型导入报错
• 路由切换后，页面不显示内容，刷新后正常显示（路由切换白屏的问题）
• router路由动态传参携带id进入详情页的三种模式
• 如何根据不同的父级初始化不同的导航
• 解决 Vue3 + ElementPlus 动态路由刷新页面后跳转到 404
• vue3 useRouter()返回undefined情况

扩展阅读

• Vue Router 和 组合式 API
• @Vue3的七种路由守卫使用大全 - 掘金
• 从 Vue2 迁移
• Vue Router3.0