目的:浏览器地址栏输入了未匹配的地址时,前端控制跳转到首页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'页面,(是为了用户体验不要太诡异)

vue-router配置之通用路径的更多相关文章

  1. vue router获取整条路径参数

    $route.path 当前路由对象的路径,如'/vi$route.query 请求参数,如/foo?user=1获取到query.user = 1$route.router 所属路由器以及所属组件信 ...

  2. vue router 配置默认页/404页面

    *号通配404默认页面

  3. Vue Router的懒加载路径

    单页应用产出的入口chunk大小随着业务的复杂度线性增加,导致后期加载速度越来越慢.后面就需要对不同路径下的模块进行拆分,打包到相应的chunk下,按需加载,找到chunk的大小.个数和页面加载速度的 ...

  4. Vue Router的配置

    1.beforeEnter function requireAuth (route, redirect, next) { if (!auth.loggedIn()) { redirect({ path ...

  5. python 全栈开发,Day91(Vue实例的生命周期,组件间通信之中央事件总线bus,Vue Router,vue-cli 工具)

    昨日内容回顾 0. 组件注意事项!!! data属性必须是一个函数! 1. 注册全局组件 Vue.component('组件名',{ template: `` }) var app = new Vue ...

  6. vue router 只需要这么几步

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  7. Vue.js 2.x笔记:路由Vue Router(6)

    1. Vue Router简介与安装 1.1 Vue Router简介 Vue Router 是 Vue.js 官方的路由管理器.它和 Vue.js 的核心深度集成,构建单页面应用. Vue Rout ...

  8. 前端MVC Vue2学习总结(八)——Vue Router路由、Vuex状态管理、Element-UI

    一.Vue Router路由 二.Vuex状态管理 三.Element-UI Element-UI是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,手机端有对应框架是 Mint U ...

  9. 深入浅出的webpack4构建工具---webpack+vue+router 按需加载页面(十五)

    1. 为什么需要按需加载? 对于vue单页应用来讲,我们常见的做法把页面上所有的代码都打包到一个bundle.js文件内,但是随着项目越来越大,文件越来越多的情况下,那么bundle.js文件也会越来 ...

随机推荐

  1. CF620E New Year Tree 线段树 dfs序

    luogu链接 题目大意: 有一个节点有颜色的树 操作1.修改子树的颜色 操作2.查询子树颜色的种类 注意,颜色种类小于60种 只有子树的操作,dfs序当然是最好的选择 dfs序列是什么,懒得讲了,自 ...

  2. BZOJ5170: Fable 树状数组

    Description 有这么一则传闻,O(nlogn)的排序发明之前,滋滋国的排序都是采用的冒泡排序.即使是冒泡排序,对当时的国民 来说也太复杂太难以理解,于是滋滋国出现了这样一个职业——排序使,收 ...

  3. Source not found :Edit Source Lookup Path 解决方案

    作者原创,转载请注明转载地址 在eclipse中用debug调试的时候,出现了以下问题,很是尴尬,经常碰到,所以有必要进行总结一下: 对该问题有两种解决方案, 一种比较文明:解决方法可参考如下网址: ...

  4. spring boot 无法读取application.properties问题

    spring boot 无法读取application.properties问题 https://bbs.csdn.net/topics/392374488 Spring Boot 之注解@Compo ...

  5. MVC 中Simditor上传本地图片

    1.引用样式和js文件 <link href="~/Content/scripts/plugins/simditor/css/simditor.css" rel=" ...

  6. 样本打散后计算单特征 NDCG

    单特征 NDCG 能计算模型的 NDCG,也就能计算单特征的 NDCG,用于评估单特征的有效性,跟 Group AUC 用途一样 单特征 NDCG 如何衡量好坏 如果是 AUC,越大于或小于 0.5, ...

  7. LINK : fatal error LNK1104: 无法打开文件“libboost_serialization-vc90-mt-gd-1_62.lib”

    boost安装:https://www.cnblogs.com/sea-stream/p/10205425.html 在vs中添加

  8. shell 截取字符串

    vvar='{"floor":2,"hotelid":"3433bbb"}' #vvar='{"hotelid":&qu ...

  9. STL_算法_中使用的函数对象

    写在前面: STL算法中的 函数对象的功能: (1).都是提供一种比较的函数,比较相邻的左右两个值的 相等/大小 等的关系, (2).返回值都是bool :该返回值 貌似是指明 遍历元素是否还要继续往 ...

  10. [ios]"The identity used to sign the executable is no longer valid"错误解决方法

    重新去开发者网站,申请一遍profiles 参考:http://www.bubuko.com/infodetail-982908.html 我出现这个错误的情况,程序提交app store之后,第二天 ...