目的:浏览器地址栏输入了未匹配的地址时,前端控制跳转到首页index页面:
项目入口js:(一般根据项目结构不同,这个js一般取名为:app.js或者main.js)
import Router from ‘vue-router‘ Vue.use(Router); const router = new Router({ routes: [ {path: "/index", component: HomePage}, {path: "/login", component: Login}, {path: "*", redirect:‘/index‘},//这个意思就是如果浏览器地址栏输入的不是‘/index‘也不是‘/login‘,那我就让它跳转到‘index‘页面 ] });
备注:
{path: "*", redirect:‘/index‘}
*号代表匹配所有路径,注意这句要放在其他路径的最后面。
由于我这个前端项目只配置了2个路径:‘index’和‘login‘,所以我需要当浏览器地址栏输入的不是‘/index‘也不是‘/login‘时,那我就让它前端控制路由跳转到‘index‘页面,(是为了用户体验不要太诡异)