新聞中心
這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
vue項目中實現(xiàn)當訪問路由不存在的時訪問404頁面的方法-創(chuàng)新互聯(lián)
今天就跟大家聊聊有關(guān)vue 項目中實現(xiàn)當訪問路由不存在的時訪問404頁面的方法,可能很多人都不太了解,為了讓大家更加了解,小編給大家總結(jié)了以下內(nèi)容,希望大家根據(jù)這篇文章可以有所收獲。
前言:
在Vue項目中,當訪問的頁面路由不存在或錯誤時,頁面顯示為一片空白。然而,通常我們需要對訪問url不存在或者錯誤的情況下添加默認的404頁面,即not found頁面。
一般的處理方法是:
在最后添加一個path: * ,優(yōu)先級從上到下查找路由,都沒有的時候全部指向 404頁面 ,代碼如下:
const baseRoute = [ { path: '/login', name: 'login', component: Login }, {path: '/', redirect: '/index', component: Layout, name: 'dashboard'}, // 404page { path: '/404', name: 'page404', component: page404 }, { path: '/', redirect: '/index', component: Layout, children: [ { path: 'index', name: 'index', component: ModeIndex, meta: { title: '', // 設(shè)備建模 icon: '' } }, { path: 'project', name: 'project', component: Project, meta: { dynamic: true, // 動態(tài)面包屑標題 title: '' } } ] } { path: '*', // 頁面不存在的情況下會跳到404頁面 redirect: '/404', name: 'notFound', hidden: true } ] const router = new Router({ routes: baseRoute })
網(wǎng)頁題目:vue項目中實現(xiàn)當訪問路由不存在的時訪問404頁面的方法-創(chuàng)新互聯(lián)
網(wǎng)頁URL:http://www.dlmjj.cn/article/dijisd.html