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

这是B页面onLoad里接收，写完了就这么简单，心想也不过如此嘛，让然后自信满满的触发条件跳转的时候，页面是跳过去了，但发现控制台空空如也，空无一值，空.... 返回再次跳转传参的时候这时候数据又有了，？这两天公司需要用到uniapp之前没写过想着跟vue差不多上手应该也不是很难，浑身充满自信，然而事情却没有那么简单，记录一下坑。页面之间跳转传参，如果字段太长会失败，因为有字数限制，所以这种传参

李不言￥

2128人浏览 · 2022-12-08 16:09:27

李不言￥ · 2022-12-08 16:09:27 发布

这两天公司需要用到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') //每次销毁监听，不然重复监听
			
		}

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