关于vue3 history相关问题解决方案

我实际操作了一下,我觉得有必要纠正一下,在实际开发种,实际上,可能我的上一章节匹配,会出现一些小问题

他会告诉你,你匹配的方式不对,不能用这种方式!于是你就去找,正则匹配方式,然后利用重定向

这次系统又会告诉你,栈溢出问题,我们先看栈溢出啥意思

在代码中的某个地方，您正在调用一个函数，该函数又调用另一个函数，依此类推，直到达到调用堆栈限制。这几乎总是因为具有未满足的基本情况的递归函数

这是官方说的一句话,不过其实好像自己懂了,又好像没懂,假设说我们用的是重定向,你这个时候,确实跟上面的说的一样,其实我们没必要用重定向,我们看匹配方案!

代码如下:

import { createRouter, createWebHistory } from 'vue-router'

const routes = [{ path: '/', component: () => import('../views/user.vue') },

{ path: '/:catchAll(.*)', component: () => import('../views/error.vue') }]

const router = createRouter({

history: createWebHistory(process.env.BASE_URL),

routes

})

export default router

当然这是动态路由加载方法,也叫做路由懒加载,其实根据你自己叫法了!

这样你随便输入一个组件,就可以到你创建的错误组件里面了,当然404组件你别忘记了创建了,这种错误,别大意了!