uni-app $emit和$on传值第一次获取不到值

这两天公司需要用到uniapp  之前没写过  想着跟vue差不多 上手应该也不是很难,浑身充满自信,然而事情却没有那么简单,记录一下坑

页面之间跳转传参,如果字段太长会失败,因为有字数限制,所以这种传参不太合适

uni.navigateTo({
		  url:'/pages/index/read?id=2',
					  
		});

然后打开官网一顿查,又换成了这种写法 A页面跳转

uni.navigateTo({
	
					   url:'/pages/index/read',
					   success: (res) => {
							 uni.$emit('update', this.list)
					   		 }
				});

这是B页面onLoad里接收,写完了就这么简单,心想也不过如此嘛,让然后自信满满的触发条件跳转的时候,页面是跳过去了,但发现控制台空空如也,空无一值,空.... 返回再次跳转传参的时候这时候数据又有了,??? 然后大脑被一串问号填满,为啥第一次跳转没有数据

onLoad(option) {
			
			uni.$on('update', (data) => {
		
					console.log('监听到事件来自 update ,携带参数 为:' , data);
					this.list = data
				})

		},

经翻阅官网 找到了答案 各位请看

 找到问题后所在,就好解决了 解决办法用嵌套,当然还有别的方法比如在跳转的时候设置一个定时器

 A页面

		uni.navigateT
					   
					   url:'/pages/index/read',
					
					   
					   success: (res) => {
								uni.$on('update1',()=>{
									 uni.$emit('update', this.list)
								})
					   		 }
				});

B页面

onLoad(option) {
			
			uni.$on('update', (data) => {
		
					console.log('监听到事件来自 update ,携带参数 为:' , data);
					this.list = data
				})
			uni.$emit('update1')

			
		},

	onUnload(){
			uni.$off('update') //每次销毁监听,不然重复监听
			
		}

注意:在跳转页面,需要销毁每次监听,不然会重复

  • 6
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值