vue 项目中页面跳转如何带参数？

Question

由于图片无法上传，所以我用文字说明：

有两个页面，一个是 info 页（显示个人信息的页面），如下：

---

姓名：小明
手机：[phone]

---

一个是 update 页（点击手机号进入此页）

---

手机：[phone]
验证码：...

---

问题是这样的：我从 info 页点击手机号进入 update 页，
需要把手机号一起传过去，如何做呢？（update 页的手机号肯定不是从服务器请求来的吧）

我尝试写了一个 evenbus，然后在 info 页 bus.$emit('phone', this.phone) ，然后在 update 页的 created 钩子里监听 bus.$on('phone', phone) ，但是传不过来，应该如何写呢？

Answer 1

没有用vue-router路由传参吗？
跳转页

this.$router.push({name:'路由命名',params:{参数名:参数值,参数名:参数值}})

接收页

this.$route.params.参数名

Answer 2

传值：链接地址后面拼接字符串 /update?n=18503118888
取值：this.$route.query.n

Answer 3

this.$router.push({path: 'xxx', query: {aaa: 1}})

=> xxx?aaa=1 地址栏会这样显示

取地址栏参数:

this.$route.query.aaa

Answer 4

楼上的两位的方法都可以用，如果你要把phone设为必传的话，还可以这样：
index.js页面

{
   path: '/info/:phone',
   name: 'info',
   component: info,
   props: true
}

info页传参：

<router-link :to="/info/13800138000">我的订单</router-link>

update页接收：

props: ['phone'],
watch: {
  phone(v) {
    console.log(v)
  }
}