uniapp官方规定switchTab跳转不支持URL传参。本文介绍两种替代方案:一是利用uni.setStorageSync将数据存入本地缓存,在目标页onShow中读取;二是通过Vue.prototype定义全局变量,在源页赋值并跳转,目标页onShow中获取。注意tabBar页面缓存机制,数据更新需置于onShow而非onLoad。
一、需求:
在tabBar页面之间进行跳转时,需要传递特定参数。
根据官方文档说明,跳转至tabBar页面的操作必须使用uni.switchTab,且URL路径后不允许携带参数。
二、解决方法:
方法1:利用本地缓存(setStorageSync)
//index.vue 页
onclick () {
存起来,在另一个页面中获取.
uni.setStorageSync('myIndex', value);
uni.switchTab({
url:'/pages/user/user'
})
}//user.vue 页(在onShow生命周期中从本地缓存读取数据,并执行相关操作)
onShow() {
const myIndex= uni.getStorageSync('myIndex');
console.log(myIndex)
}方法2:使用全局变量
在main.js中定义全局变量
Vue.prototype.$name = '';页面1:name.vue
this.$name= "chuanzhi";
uni.switchTab({
url:'/pages/index/index'
})页面2:index.vue(注意:务必将数据更新逻辑放在onShow生命周期中,因为tabBar页面存在缓存机制,再次进入时不会触发onLoad)
onShow(){
this.info.name = this.$name//赋值取得参数
}此时this.info.name即为从name.vue页面传递过来的参数值
至此,关于uniapp实现tabBar-switchTab之间传参的文章介绍完毕,更多相关uniapp tabBar-switchTab传参内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!