在vue中使用插件的步骤
1、引入Vue
2、引入插件
3、使用插件 Vue.use()
当路由配置成功以后Vue中就会多了两个内置组件 <router-view></router-view> //当路径匹配成功以后 router-view用来显示相对应的组件 <router-link></router-link>
1、做路由的跳转 必须要添加一个属性 to:跳转的路径
2、除此之外 router-link 身上还会有一个tag属性 指定router-link 渲染成指定的标签
路由的配置 mode:路由的形式 hash路由 history路由 routes:[] 每一个路由页面的配置项 routes中的配置项 path:"路径匹配的路径" component:当路径匹配成功需要渲染的组件 redirect：重定向 children:路由嵌套的配置项 这个属性和routes一样 路由嵌套中path只需要写路径的名称即可 name:当前路由的名称 props:路由解耦 路由传值的方式 1、动态路由 流程 1、在定义路由的时候设置传递数据的key值 path:"/路由地址/:key1/:key2" key1 key2代表的数据的键值 2、在做路由跳转的时候定义传递的数据 to="/路由地址/参数1/参数2" 3、在需要接受信息的组件内部通过this.$route.params进行接收 2、query传值 流程： 1、通过query的方式进行数据的传参 key=val&key=val 简写："name:路由地址，query:{id: ,name:}" 所谓的query传值其实就是我们常说的get传值的方式 通过？后面进行拼接 2、接收的时候通过this.$route.query进行接收 3、路由解耦(只适合动态路由传值) 1、在定义路由的时候添加一个属性props:true 2、接收的时候只需要通过props进行接收即可 query传值 和 params 传值的区别？ 前者的参数可传可不传 后者的参数是必须要传递的 编程式导航 路由跳转的方式 1、a标签跳转 影院 2、组件 router-link 3、编程式导航 通过js进行路由的跳转 this.$router.push 跳转 this.$router.back 后退 this.$router.forward 前进 this.$router.replace 替换
原文：https://www.cnblogs.com/manban/p/11117137.html