首页 > 编程知识 正文

vue跨域问题怎么解决,出现心理问题怎么解决

时间:2023-05-06 11:41:15 阅读:276281 作者:101

import Vue from 'vue';import Router from 'vue-router';// 两种页面引入方式// 方式1,将所有页面import进来,会打包成一个巨大的js,首页加载慢,后续页面加载快,不推荐// import Page404 from '@/pages/Page404';// import Indexfrom '@/pages/index';// 方式2,路由懒加载,所有页面按需加载,推荐,但"Loading chunk {n} failed"出现几率高于方式1,原因未知const Page404 = resolve => require(['@/pages/Page404'], resolve);const Index= resolve => require(['@/pages/index'], resolve);Vue.use(Router);const $router = new Router({ mode: 'history', // 解决vue框架页面跳转有白色不可追踪色块的bug scrollBehavior (to, from, savedPosition) { return { x: 0, y: 0 } }, routes: [ { path: '*', name: page404 component: Page404 }, { path: '/index', name: index component: Index }, ]}) // 解决Loading chunk (d)+ failed问题$router.onError((error) => { const pattern = /Loading chunk (d)+ failed/g; const isChunkLoadFailed = error.message.match(pattern); if(isChunkLoadFailed){ // 用路由的replace方法,并没有相当于F5刷新页面,失败的js文件并没有从新请求,会导致一直尝试replace页面导致死循环,而用 location.reload 方法,相当于触发F5刷新页面,虽然用户体验上来说会有刷新加载察觉,但不会导致页面卡死及死循环,从而曲线救国解决该问题 location.reload(); // const targetPath = $router.history.pending.fullPath; // $router.replace(targetPath); } });export default $router;

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。