1.如果你的静态路由最后有如下代码:

  // 404 page must be placed at the end !!!
{ path: "*", redirect: "/404", hidden: true },

2.如果你的路由有一部分是动态获取的话,刷新页面会路由到404页面,404页面一定要放在最后,动态路由 addRoutes 之后,需要重新添加一下404页面,如下:

在 router.js 页面:

export const error404 = { path: "*", redirect: "/404", hidden: true };

3.在动态路由逻辑里一般是permission.js

import router from "./router";

import { error404 } from "./router";

router.addRoutes([...asyncRouter, error404]);

vue 动态路由刷新页面404的更多相关文章

  1. vue-router动态路由 刷新页面 静态资源没有加载的原因

    在做项目的时候,发现刷新页面的时候,静态路由没有加载,度娘了一圈,终于解决了. vue-router使用history模式+使用嵌套路由: 访问路由和嵌套路由页面,显示正常,但是刷新页面的时候,嵌套路 ...

  2. Vue 实现动态路由及登录&404页面跳转控制&页面刷新空白解决方案

    Vue实现动态路由及登录&404页面跳转控制&页面刷新空白解决方案   by:授客 QQ:1033553122   开发环境   Win 10   Vue 2.9.6   node-v ...

  3. vue 动态路由添加的问题

    vue3中在router/index.js中 import { createRouter, createWebHistory } from 'vue-router'; import store fro ...

  4. vite2.9 + vue3.2 打包部署到nginx上刷新页面404问题

    vite2.9 + vue3.2 打包部署到nginx上刷新页面404问题 在本地运行没问题,部署到服务器上,能正常访问,但是刷新之后页面404 原有的Nginx配置为: server { liste ...

  5. antdpro 打包部署后访问路由刷新后404

    antdpro build 后访问路由刷新后 404? 解决方法有三种: 1. 改用 hashHistory,在 .umirc.js或者是config.js 里配 history: 'hash' 2. ...

  6. Vue 部署单页应用,刷新页面 404/502 报错

    在 Vue 项目中,可以选择 hash或者 history.pushState() 实现路由跳转.如果在路由中使用history模式: export default new Router({ mode ...

  7. vue通过路由实现页面刷新

    vue 开发微信商城项目,需求如下: 购物车页面跳转到详情页,购物车页面包含了多个组件,点击结算跳转到订单页面,从订单返回时,购物车页面没有刷新,由于购物车组件之间通过bus实现事件传递,页面跳转(非 ...

  8. vue下使用nginx刷新页面404

    nginx 是一个代理的服务器.出现的问题:写好的页面通过nginx作为代理的服务器给别的同事看的时候发现了新写的页面打开就404,并且从其他页面跳转可以看到但是刷新页面就404.解决方法:在文件中的 ...

  9. vue 后退不刷新页面

    使用 this.$router.push({path: '/aichat'})路由跳转方式跳转页面 要实现 home => chat  chat页面刷新: chat => report, ...

  10. vue自动路由-单页面项目(非build时构建)

    博客中自动路由的原理? 答:简单点说,就是在请求页面时,根据url进行动态添加路由. 与其它自动路由博客的区别? 目前网上的博客,一般都是在build的时候进行动态路由添加,而本博客,采用的是在获得u ...

随机推荐

  1. wkhtmltopdf 代替 itext 将 url 转成 pdf

    通过 itextpdf 的 HtmlConverter.convertToPdf(); 方法生成的pdf 有点让人失望,CSS啥的不起作用了,(有可能我用得不对) 后来用 wkhtmltopdf.ex ...

  2. FTP 被动模式配置

    总结:FTP 21端口,可以主动连接,防火墙配置一下21端口放行就OK了.非21端口,需要设成被动连接和端口范围.防火墙要做相应的配置 原理 https://www.cnblogs.com/zjoch ...

  3. Tomcat--启动慢

    本篇为转载文章 来自:https://www.cnblogs.com/user-sunli/articles/13917035.html 有时启动Tomcat,发现启动很慢,需要几分钟,这个问题值得重 ...

  4. POJ 1742 Coins(多重背包的可行性问题)

    Description People in Silverland use coins.They have coins of value A1,A2,A3...An Silverland dollar. ...

  5. AtCoder Regular Contest 123 (A~C 三道好题)

    比赛链接:Here A - Arithmetic Sequence (good) 注意细节 int main() { cin.tie(nullptr)->sync_with_stdio(fals ...

  6. 一篇文章教你从入门到精通 Google 指纹验证功能

    本文首发于 vivo互联网技术 微信公众号 链接:https://mp.weixin.qq.com/s/EHomjBy4Tvm8u962J6ZgsA作者:Sun Daxiang Google 从 An ...

  7. 【RK3399】2.制作ubuntu20.04 roomfs

    firefly自带的文件系统,由于缺少一些基本功能模块,因此,我们可以自己手动制作一个ubuntu20.04的文件系统. 下载Ubuntu根文件系统 http://cdimage.ubuntu.com ...

  8. 深度学习基础课:使用Adam算法

    大家好~我开设了"深度学习基础班"的线上课程,带领同学从0开始学习全连接和卷积神经网络,进行数学推导,并且实现可以运行的Demo程序 线上课程资料: 本节课录像回放 加QQ群,获得 ...

  9. 文心一言 VS 讯飞星火 VS chatgpt (182)-- 算法导论13.4 6题

    六.用go语言,Skelton 和 Baron 教授担心在 RB-DELETE-FIXUP 的情况1开始时,结点 x.p 可能不是黑色的.如果这两位教授是对的,则第5~6行就是错的.证明:x.p 在情 ...

  10. ICDM'23 BICE论文解读:基于双向LSTM和集成学习的模型框架

    本文分享自华为云社区<ICDM'23 BICE论文解读>,作者:云数据库创新Lab. 导读 本文<Efficient Cardinality and Cost Estimation ...