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>
相关推荐
lh_1254几秒前
uniapp 常用开发技巧与实战指南
uni-app
天天扭码24 分钟前
总所周知,JavaScript中有很多函数定义方式,如何“因地制宜”?(ˉ﹃ˉ)
前端·javascript·面试
一个专注写代码的程序媛28 分钟前
为什么vue的key值,不用index?
前端·javascript·vue.js
장숙혜39 分钟前
ElementUi的Dropdown下拉菜单的详细介绍及使用
前端·javascript·vue.js
火柴盒zhang42 分钟前
websheet之 编辑器
开发语言·前端·javascript·编辑器·spreadsheet·websheet
某公司摸鱼前端1 小时前
uniapp 仿企微左边公司切换页
前端·uni-app·企业微信
WKK_1 小时前
uniapp自定义封装tabbar
前端·javascript·小程序·uni-app
莫问alicia1 小时前
react 常用钩子 hooks 总结
前端·javascript·react.js
晨集1 小时前
Uni-App 多端电子合同开源项目介绍
java·spring boot·uni-app·电子合同
Mintopia1 小时前
图形学中的数学基础与 JavaScript 实践
前端·javascript·计算机图形学