路由的基本配置

1.name

可以用name实现跳转

image.png

Go to Foo

2.meta

用来保存路由里面的信息，写html的时候会写一些meta，里面提供页面有关的元信息（meta-information）。

3.children

嵌套路由，路由下面可以放子路由。

image.png

test是在/app路径下面放的children，所以应该放在Todo组件所在的页面里面。

4.transition

过渡动画，可以包裹在路由外面，可以作用在路由的切换。

image.png

image.png

5.路由传参

image.png

image.png

image.png

this.$route打印出来就是以下信息

image.png

6.props

• 在声明路由的地方，加props

  
  
  image.png

声明id的props

image.png

this.id 打印出来如下

image.png

还可以指定id

image.png

image.png

还可以根据query进行传递
url后面接参数
？a=123&b=456
这种形式就是query

image.png

image.png

注意：尽量让组件和路由解耦，尽量不要在组件里面去使用$route，这样组件的复用性会更高。

7.命名视图

同一个页面多个时

image.png

有多个视图的时候，要把component改成components

image.png