uniapp returns to the previous page with parameters

Preface: The applicable scenario for returning to the previous page with parameters is to jump from a list page to a details page. For example, this data can be deleted in the details page. When returning to the list page, it is hoped that this data will be automatically deleted in the list without refreshing. Delete this data in the case of the entire list page, so that the user experience will be more friendly;

1. On the first page one.vue, monitor the returned parameters in the onShow() method, and the returned parameters are defined in the variable called 'returnData' on the previous page;

<template>
	<view>
		<navigator hover-class="none" url="/pages/two/two">跳到第二个页面</navigator>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		onShow() {
			let that = this
			uni.$on('returnData',function(data){
				console.log('监听到事件来自返回的参数:' + data);
			})
		},
		methods: {
			
		}
	}
</script>

<style>

</style>

2. The second page, two.vue, returns the one.vue page, and the parameter to be passed is index:1

<template>
	<view>
		<button @click="goBack">点击返回上一页</button>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				index:1,//返回上一页要穿的参数
			}
		},
		methods: {
			goBack() {
				uni.$emit('returnData', this.index)
				uni.navigateBack({
					delta: 1
				})
			}
		}
	}
</script>

<style>

</style>

Guess you like

Origin blog.csdn.net/spring_007_999/article/details/126866272