需要掌握：vue教程：路由案例

编程式 路由

this.$router.push() 是编程式路由，一般写在 点击按钮 事件中

<router-link :to="..."> 是声明式路由，等同于调用 router.push()

跳转页面

想要跳转页面，使用 router.push() 方法，这个方法会向 history 栈添加一个新记录，所以，当用户点击 浏览器 【后退】 按钮时，会回到之前的页面

url

router.push() url可以是 字符串、json对象：

1. 字符串：

   this.$router.push('/home/first')
   

2. 对象

   this.$router.push({ path: '/home/first' })
   

3. 命名的路由

   router.push({ name: 'user'})
   

传参 和 获取参数

params参数：

params 参数 不会在地址栏显示，同 http post 请求

this.$router.push({ name: 'user', params: { userId: 123 }})

获取参数：

this.$route.params.userId}

注意： 接收参数的时候是 route而不是 router

query参数

query 参数会 在地址栏显示，形式：url?key=value，同 http get 请求

this.$router.push({path: '/order', query: {userId: "2"}});

url 变成 /order?selected=2

获取参数

this.$route.query.userId}

原文出处：/show_1IXfmqq4ONx.html