uniapp uni.navigateback返回上一页并返回参数

uniapp - uni.navigateback返回上一页并返回参数

前言

毕设的前端需要点击一个输入框，跳转到一个选择页面，点击选项后返回页面并且将刚才所选择的内容绑定到输入框中，所以我就想着返回页面的时候传参，主页面接收参数并绑定到对应表单控件。
但是在一顿搜索之后发现网上搜到的大多数都是一样的，我也理解不了是为什么，于是就去看uniapp的官方文档，结果发现文档里就有方法，所以我就模仿了官方文档的方法实现了

实现

其实就是把官方的复制黏贴过来改改就能用了
主页面（部分代码）

methods: {
	selectArticleType() {
		var that = this;
		uni.navigateTo({
			url: '../selectArticleType/selectArticleType',
			events: {
				//自定义一个监听器名, data为选择页面返回的数据
				selectType(data) {
					that.model.typeName = data.name;
					that.model.typeId = data.id;
				}
			}
		})
	},
	...
}

选择页面（部分代码）

methods: {
	select(id, name) {
		// #ifdef APP-NVUE
		const eventChannel = this.$scope.eventChannel; // 兼容APP-NVUE
		// #endif
		// #ifndef APP-NVUE
		const eventChannel = this.getOpenerEventChannel();
		// #endif
		var vm = {
			id: id,
			name: name
		}
		//注意，这里的第一个参数要和主页面的监听器名称一致
		//第二个就是要传的数据，我这里是传了一个对象回去
		eventChannel.emit('selectType', vm);
		uni.navigateBack();
	}
}

这样就可以在关掉子页面的同时把数据传回主页面啦
更多详情大家也可以去官方文档一探究竟：
https://uniapp.dcloud.io/api/router?id=navigateto
官方文档截图：

结尾

如果用官网的方法还有问题的话可以直接私信我或者在评论区问我，十分乐意为您解答，或者是我也不明白的情况，可以一起探讨一下

补充更新

后来我无意间看到还可以直接把要传的数据先存到缓存里面，页面返回后直接从缓存里面取，也是大开眼界，这又多了一种方法参考

uni.setStorageSync()
uni.setStorage()