声明式导航跳转取值方式

一.路径参数取值方式

1. props

1. home.vue

<router-link to="/move/1">电影</router-link>

2. 路由配置

{
      path: '/move/:mid',
      name: 'move',
      component: Move,
      props: true//如果这个没有开启的话，则页面无法获取到参数
    }

3. move.vue

<div>取参方式一：{{mid}}</div>

//如果这里没有写，则无法直接获取到mid
props: ['mid']

2.$route.params

1. home.vue

<router-link to="/move/1">电影</router-link>

3. move.vue

<h3>路径参数取值</h3>
<div>取参方式二：{{$route.params}}</div>

3.配图

二.查询参数取值 $route.query

1. home.vue

<router-link to="/move?username=sun&age=18">电影</router-link>

2. move.vue

<h3>查询参数取值</h3>
<div>取值方式：{{$route.query}}</div>

3. 配图
   

三.备注小点

1.path 路径地址

2.fullPath 完成地址