taro路由传参（vue）

最近在使用taro做h5和小程序，虽然也是用的vue，但是发现页面跳转，路由，事件绑定等很多东西都和以往不大一样。

今天记录一下路由传参。

假如从A页面携带订单号跳转到B页面

A页面：（传递参数）

Taro.navigateTo({ 
url: `/pages/afterSale/list/sendDetail/index?code=${code}`
})

B页面：（接收参数）

以往路由接参使用的是 this.$router.params，taro1/2升级到 taro 3 后使用 getCurrentInstance().router 替代 this.$router，getCurrentInstance 作为新 API 从 @tarojs/taro引入。

import { getCurrentInstance } from '@tarojs/taro'

// 单个参数
created() {
    this.code = getCurrentInstance().router.params.code
console.log(this.code); 
  },

// 多个参数
created() {
    this.code = getCurrentInstance().router.params.code
console.log(this.code); 
  },

多个参数时：

传参：

Taro.navigateTo({ 
url: `/pages/afterSale/list/sendDetail/index?id=2&type=test`
})

 接收参数：

import { getCurrentInstance } from '@tarojs/taro'
created() {
  this.obj = Taro.getCurrentInstance()
  },

mounted () {
// 获取路由参数
console.log(this.obj.router.params) // 输出 { id: 2, type: 'test' }
}