vue路由信息对象

一个路由信息对象表示当前激活的路由的状态信息,每次成功的导航后都会产生一个新的对象。

path字符串,对应当前路由的路径

params对象,包含动态路由参数

query对象,URL查询参数

hash字符串,当前路由的hash值

fullPath字符串,URL包含查询参数和hash的完整路径

matched数组,包含当前路由的所有嵌套路径片段的路由记录

name字符串,包含路由的名称

router-link配置项

tag='li':修改默认的a标签

exact:路径精确匹配

全局activeClass样式:

在router文件夹下的index.js配置:

 linkActiveClass:'is-active', 

局部activeClass样式:

在<router-link>行间设置: active-class='activeClass' 

event='mouseover':在鼠标移入时切换路由,默认是点击时切换,event来声明用来触发导航的事件,可以是一个字符串或者是包含字符串的数组。

如果地址栏访问的路径没有匹配的路由,在router文件夹下的index.js配置,

import noFound from '@/components/404'
 {
  path: '*',
  //component:noFound
  //重定向
  // redirect: '/home'
  // redirect: {path:'/home'}
  // redirect: {name:'Home'}
  redirect:(to)=>{ //动态设置重定向的目标
    //目标路由对象,就是访问的路径的路由信息
    console.log(to.path)
    return '/home'
  }
  }

在<router-view>里写的class,会渲染到所有匹配到的路由的页面的根节点上。

posted @ 2019-04-08 08:54  叶子玉  阅读(1031)  评论(0编辑  收藏  举报