微信小程序调用上一页的方法(主包,分包)

微信小程序调用上一页的方法(主包,分包)

  • 一、介绍
  • 二、代码
    • [1、const pages = getCurrentPages();](#1、const pages = getCurrentPages();)
    • [2、const prevPage = pagespages.length - 2;](#2、const prevPage = pages[pages.length - 2];)
    • [3、const prevVm = prevPage.vm \|\| prevPage;](#3、const prevVm = prevPage.vm || prevPage;)
    • [4、if (prevVm) { prevVm.getList.call(prevVm); }](#4、if (prevVm) { prevVm.getList.call(prevVm); })

一、介绍

小程序页面跳转有时候需要进行数据的更新操作

从列表页面点击某一条数据跳转到详情页 ,然后再详情页操作完成提交之后,一般都会返回上一页(列表页),这里需将上一页的数据进行更新(刚才操作的数据)等操作

微信小程序页面页面栈:https://developers.weixin.qq.com/miniprogram/dev/reference/api/getCurrentPages.html

微信小程序返回上一页面:https://developers.weixin.qq.com/miniprogram/dev/api/route/wx.navigateBack.html#功能描述

二、代码

1、const pages = getCurrentPages();

使用getCurrentPages()获取当前页面栈

2、const prevPage = pagespages.length - 2;

我这里是从主页面(主包)----->列表页面(分包2)----->详情页面(分包2)进行跳转的,索引为0,1,2,长度length为3,这里是要从info页面跳转到list页面

获取上级页面pagespages.length - 2,因为数组索引为0,1,2,,数组长度为3,数组长度比数组索引大1,又因为当前页面为最后一个,所以当前页面为pagespages.length - 1`,那上级页面就是pagespages.length - 2

3、const prevVm = prevPage.$vm || prevPage;

因为小程序有文件大小的限制,有的文件不在主包pages里面,存在于其他分包里面(uni-app 分包页面的实例挂载规则特殊:分包页面不会直接挂载到prevPage根节点,而是挂载在 prevPage.$vm【Vue 实例的真实载体】上),对于不是分包的就为空使用后面的

4、if (prevVm) { prevVm.getList.call(prevVm); }

确保实例存在,然后进行调用上一个页面的方法

bash 复制代码
// 获取当前所有已加载的页面栈(数组形式)
const pages = getCurrentPages();
// 从页面栈中获取「上级页面实例」(数组倒数第二个元素 = 上一级页)
const prevPage = pages[pages.length - 2];
// 兼容分包页面:获取上级页真实的Vue实例(分包页方法挂载在$vm上)
const prevVm = prevPage.$vm || prevPage;
// 确保上级Vue实例存在
if (prevVm) {
	// 调用上级页的getList方法,并强制绑定this指向(这里根据需要进行调用方法)
	prevVm.getList.call(prevVm);
}
相关推荐
andrsted2 小时前
练题簿在线免费刷题:听读练题支持暂停续播、循环播放,让自己的题库听得更方便
学习·微信小程序·小程序·刷题·在线刷题
weixin_4222013021 小时前
如何解决小程序图标点击热区小,落点不准问题?
前端·小程序·样式·点击热区·扩大
河北清兮网络科技1 天前
直播APP商用开发深度解析:为什么模板系统无法支撑规模化直播平台
运维·网络·人工智能·小程序·短剧app
今年下半年1 天前
【微信小程序】uni-app + Vue3 + Vite 的小程序项目实现「进入指定范围才能打卡」的考勤功能
微信小程序·uni-app·定位·考勤
Geek_Vison1 天前
政务APP新增鸿蒙客户端,如何复用已有的业务单元?
小程序·harmonyos·mpaas·政务·小程序容器
沐子a~1 天前
小程序实战:萌宠案例
小程序
火眼金睛记单词1 天前
零基础成人重拾英语:第一个月的30天行动地图
前端·经验分享·学习·小程序
xinraynet1 天前
沈阳企业小程序开发选型:五个可核验维度,附设备数据采集与私域商城的技术实现要点
大数据·科技·ai·微信小程序·小程序
小码哥0682 天前
Java医院陪诊系统陪护系统陪诊小程序,三端齐全可定制
大数据·小程序·陪诊陪护·陪诊小程序·陪护系统·陪诊系统·陪护小程序
连涨- AI脑波英语2 天前
机构小程序对接词汇课程,测试账号怎样与正式学生账号隔离?
小程序·接口安全·脑机单词速记