taro路由传参(vue)
最近在使用taro做h5和小程序,虽然也是用的vue,但是发现页面跳转,路由,事件绑定等很多东西都和以往不大一样。今天记录一下路由传参。假如从A页面携带订单号跳转到B页面A页面:(传递参数)Taro.navigateTo({url: `/pages/afterSale/list/sendDetail/index?code=${code}`})B页面:(接收参数)以往路由接参使用的是 this.$r
最近在使用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' }
}
更多推荐
所有评论(0)