目的:浏览器地址栏输入了未匹配的地址时,前端控制跳转到首页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. BZOJ2724 [Violet]蒲公英 分块

    题目描述 经典区间众数题目 然而是权限题,所以题目链接放Luogu的 题解 因为太菜所以只会$O(n*\sqrt{n}+n*\sqrt{n}*log(n))$的做法 就是那种要用二分的,并不会clj那 ...

  2. darknet-训练自己的yolov3模型

    目录 Yolo v3的使用方法 安装darknet 训练Pascal VOC格式的数据 修改cfg文件中的voc.data 修改VOC.names 下载预训练卷积层权重 修改cfg/yolov3-vo ...

  3. UVa 1149 装箱

    https://vjudge.net/problem/UVA-1149 题意:给定N个物品的重量和背包的容量,同时要求每个背包最多装两个物品.求至少需要的背包数. 思路:很简单的贪心.每次将最轻的和最 ...

  4. 获取公网IP地址

    https://ipip.yy.com/get_ip_info.php http://pv.sohu.com/cityjson?ie=utf-8 http://www.ip168.com/json.d ...

  5. BZOJ 1758 【WC2010】 重建计划

    题目链接:重建计划 这道题现在已经成为一道板子题了…… 这是个非常显然的0-1分数规划,可以二分答案之后树分治判定一下.注意树分治的时候如果使用单调队列,需要把所有儿子预先按最大深度排好序,否则会被扫 ...

  6. 华中农业大学预赛 B Handing Out Candies 余数的和

    Problem B: Handing Out Candies Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 258  Solved: 19[Submit ...

  7. MVC 子对象数据传递

    1.接受参数 public ActionResult Address(User user) { return View(); } 2. User对象类型 public class User { pub ...

  8. [ios]安装CocoaPods及使用详解

    最新 macOS Sierra 10.12.3 安装CocoaPods及使用详解 http://www.jianshu.com/p/b64b4fd08d3c CocoaPods的安装以及遇到的坑 ht ...

  9. 怎么运行cocos2dx 3.x simulator?

    1.simulator的好处是: 快速切换分辨率:F5快速重新启动项目: 这对于脚本语言来说都是很方便快捷的. 2.涉及到显示参数的文件有两个: ①lang,这个是菜单的语言文件,如果没有这个文件的话 ...

  10. Paket介绍

    在国外.NET社区有一个很火的话题是Packet(https://fsprojects.github.io/Paket/index.html ),它本质上是Nuget 之外的另一种方式管理.NET项目 ...