uniapp中回退到上一页面并触发函数的方法

需求：当前页面调用接口成功后需要返回上一页面并调用函数

当前页面

在 onLoad 生命周期中将 getOpenerEventChannel() 方法挂载到赋值给 this.eventChannel

onLoad() {this.eventChannel = this.getOpenerEventChannel();
},

在调用接口成功后使用 emit 去调用刷新方法

setTimeout(() => {uni.navigateBack({delta: 1});// 利用this.getOpenerEventChannel().emit('参数') 方法去调用 uni.navigateTo() 中的 events// 参数就是上一页面 events 中的方法名// 刷新上一页面this.eventChannel.emit("refreshPage");
}, 1000);

上一页面

// 点击修改邮箱
handleClickModifyEmail() {uni.navigateTo({url: `./setting-email/setting-email?userId=${this.userInfoData.id}&userEmail=${this.userInfoData.fEmail}`,events: {refreshPage: () => {// 调用页面获取列表接口// 方法中的参数表示是否要重置datathis.fnGetUserInfo(true);},},});
},

这样就实现了uniapp中回退到上一页面并触发函数的方法(目的是内层页面修改数据后刷新外层页面数据)

获取列表的接口

            //获取列表fnLoadListData(isClear = false) {return new Promise((resolve) => {getImplementList({key: this.keyword,}).then((res) => {const data = res.data || [];if (isClear) {this.listData = data;} else {this.listData = [...this.listData, ...data];}if (data.length === 0 || data.length < 10) {resolve({isLoaded: true});} else {resolve({isLoaded: false});}}).catch(() => {resolve();});});},

uniapp中回退到上一页面并触发函数的方法相关推荐

uniapp如何实现返回上一级页面并传值刷新
在很多业务场景之下,需要返回上一级页面,并进行刷新,在uniapp中的uni.navigateBack 方法中,返回上一页是不会刷新的,更别说传值了,废话不多说直接上代码. 我们假设需要返回上一级页面 ...
cmd中回退到上一级文件目录与定位下一级目录
回退到上一级 cd- 定位到下一级 cd xxx(输入想到达的下一级文件名)
微信小程序下拉刷新列表onPullDownRefresh；微信小程序上划加载列表onReachBottom；uni-app微信小程序下拉加载数据；uni-app微信小程序上划页面加载数据
需求:微信小程序列表加载有两种方式,分别是按住页面下拉加载数据数据(触发onPullDownRefresh)和直接上划滚动页面到底部加载数据(触发onReachBottom函数). 本文主要是使用上划 ...
请说明在.net中常用的几种页面间传递参数的方法，并说出他们的优缺点。
QueryString 传递一个或多个安全性要求不高或是结构简单的数值.但是对于传递数组或对象的话,就不能用这个方法了 session(viewstate) 简单,但易丢失作用于用户个人,过量的存 ...
html 两个iframe重叠,解决同一页面中两个iframe互相调用jquery,js函数的方法
这一个月又没更新博客,唉,懒癌又犯了,今天解决了一个问题,关于两个iframe互相调用jquery函数方法 a.html中有两个iframe,如下: b.html中有一个treeview,称为左菜单i ...
php中upload函数,PHP中文件的上传和下载常用函数
文件的上传 1.html标签需要做的上传设置 1) form标签属性设置 1>method设置为post 2>enctype设置为multipart/form-data 3>form ...
uniapp中nvue与vue的区别
uni-app是逻辑和渲染分离的,渲染层在app端提供了两套排版引擎. 小程序方式的webview渲染,和weex方式的原生渲染,两种渲染引擎可以自己根据需要选. vue文件走的webview渲染 n ...
html整体页面缩放的方法,html5中让页面缩放的4种方法
1.viewport 这种方法,不是所有的浏览器都兼容 2.百分比这种方法,可以兼容大部分浏览器,但是修改幅度比较大 .main .login .txt1{margin-top:8.59375%; ...
iframe子页面内刷新父页面中另一个iframe子页面
框架页面如下: <div id="aa" style="float: left; height: 500px; border-right-style: solid; ...

uniapp中回退到上一页面并触发函数的方法

uniapp中回退到上一页面并触发函数的方法相关推荐

最新文章

热门文章