项目场景:.

uniapp 微信小程序项目,在某个页面执行某个方法后返回上一页,并刷新上一页的数据
在用户列表页面点击新增按钮,跳转至新增用户页面,新增成功后返回用户列表页面,并在页面中刷新当前数据,要显示刚刚添加成功的那条数据


问题描述

首先尝试直接用 uni.navigateTo 跳转回去,但是业务需求中,会有两个入口进入新增页面,这样就导致新增成功后只能跳到一个页面去
后来直接使用了uni.navigateBack({delta: 1})页面可以成功回到起始页面,但是起始页面数据不刷新


实现方案:

在起始页面中把起始页面获取数据,刷新的方法写在 init() 方法当中,在新增页面,新增成功后,获取上一个页面对象
在页面跳回上一页的时候,执行上一个页面的 init() 方法

// 起始页面
methods: {
	init() {
		// 页面数据获取的代码放在 init 当中
		this.customerList = [];
		this.getCusromerData();
	},
}
// 新增页面
addSite() {
	let pages = getCurrentPages(); // 当前页面
	let beforePage = pages[pages.length - 2];
	this.$refs.uForm.validate(valid => {
		if (valid) {
			SiteAPI.create({
				...this.site
			}).then(res => {
				this.$toast(res.msg)
				if (res.msg == '操作成功') {
					setTimeout(() => {
						uni.navigateBack({
							delta: 1,
							success: function() {
								beforePage.$vm.init(); // 执行前一个页面的init 来实现刷新
							}
						});
					}, 1000);
				} else {
					return
				}
			}).catch(err => {})
		} else {}
	});
},
Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐