uniapp使用uni.navigateBack返回页面时携带参数到上个页面

我们平时开发中也经常遇到这种场景,跳转一个页面会进行一些操作,操作完成后再返回上个页面同时要携带着一些参数

其实也很简单,也来记录一下吧

假设从A页面 跳转到 B页面

A页面

直接上完整代码了哈,很简单:

复制代码
<template>
	<view class="content">
		<button @click="gotoDemo()">跳转</button>
	</view>
</template>
<script>
	export default {
		onLoad() {
			// 跟vue的兄弟传值一个意思
			uni.$on('face-msg', this.faceMsg)
		},
		onUnload() {
			uni.$off('face-msg')
		},
		methods: {
			// 接收参数
			faceMsg(data) {
				console.log(data, '接受的参数-->>')
			},
			// 页面跳转
			gotoDemo() {
				uni.navigateTo({
					url: '/pages/demo/index'
				})
			}
		}
	}
</script>

B页面

复制代码
<template>
	<view class="content">
		<button @click="back()">返回上一页</button>
	</view>
</template>
<script>
	export default {
		methods: { 
			back() {
				// 返回上个页面携带的书
				const faceData = {
					name: 'wft',
					age: 18
				}
				uni.navigateBack({
					url: '/pages/index/index?type=face',
					success() {
						uni.$emit('face-msg', faceData)
					}
				})
			}
		}
	}
</script>
相关推荐
careybobo1 小时前
海康摄像头通过Web插件进行预览播放和控制
前端
杉之2 小时前
常见前端GET请求以及对应的Spring后端接收接口写法
java·前端·后端·spring·vue
喝拿铁写前端3 小时前
字段聚类,到底有什么用?——从系统混乱到结构认知的第一步
前端
再学一点就睡3 小时前
大文件上传之切片上传以及开发全流程之前端篇
前端·javascript
木木黄木木4 小时前
html5炫酷图片悬停效果实现详解
前端·html·html5
请来次降维打击!!!4 小时前
优选算法系列(5.位运算)
java·前端·c++·算法
難釋懷5 小时前
JavaScript基础-移动端常见特效
开发语言·前端·javascript
自动花钱机5 小时前
WebUI问题总结
前端·javascript·bootstrap·css3·html5
拉不动的猪6 小时前
简单回顾下pc端与mobile端的适配问题
前端·javascript·面试
拉不动的猪6 小时前
刷刷题49(react中几个常见的性能优化问题)
前端·react.js·面试