uniapp进行微信小程序开发,使用navigateBack返回到上一个页面时候,接口未刷新。

代码背景:

使用uniapp进行微信小程序开发时,有a和b两个页面,从a进入b页面后,通过uni.navigateBack()方法返回a页面时候,无法触发a页面的onShow函数里面的接口调用。

解决思路

uniapp官网页面通信

1.通过EventChannel方法进行页面通信。

因为使用的是vue3的方法,所以只贴vue3的源码

前往到test页面
uni.navigateTo({url: '/pages/test?id=1',events: {// 为指定事件添加一个监听器,获取被打开页面传送到当前页面的数据acceptDataFromOpenedPage: function(data) {console.log(data)},someEvent: function(data) {console.log(data)}...},success: function(res) {// 通过eventChannel向被打开页面传送数据res.eventChannel.emit('acceptDataFromOpenerPage', { data: 'data from starter page' })}
})//在test页面进行接收onMounted(() => {const instance = getCurrentInstance().proxyconst eventChannel = instance.getOpenerEventChannel();eventChannel.emit('acceptDataFromOpenedPage', {data: 'data from test page'});eventChannel.emit('someEvent', {data: 'data from test page for someEvent'});eventChannel.on('acceptDataFromOpenerPage', function(data) {console.log('acceptDataFromOpenerPage', data)})})
//onShow onLoad方法都是一样的。

可能我暂时还未遇到此种场景。已经到了b页面,为什么还要去把b页面的值传输给a页面呢,不是很理解。但是把a页面的值传入到b页面,还是很有用的。如果不使用navigateBack,选择redirectTo或者navigateTo方法都是可以进行通信,并且是重新触发show函数的。这样做有点复杂。
我们还是更想使用navigateBack进行触发回调处理。

注意:注意:注意:
getOpenerEventChannel 只能在非首页和通过 uni.navigateTo 或 uni.redirectTo 打开的页面中使用。如果你是在首页或其他不支持的场景中使用,它将不可用。

2.通过uni. $ on 和 uni. $ emit的方法的方法进行传值和触发函数

首先在b页面进行$emit的数据传递,在调用navigateBack方法之前,进行 $emit方法

 uni.$emit('refreshData', state.info);uni.navigateBack();

在a页面的onLoad函数内进行$on的接收

    uni.$on('refreshData', (val) => {console.log(val);//可以获取b页面的数据//也可以进行a页面接口的重新触发loadData();})

这样就可以解决使用navigateBack返回到上一个页面时候,接口未刷新的问题。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/45531.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

【JavaScript脚本宇宙】浏览器特性尽在掌握:JavaScript工具库全面解析

提升网页质量:六款神奇JavaScript工具库解析 前言 随着移动设备和互联网的普及,用户使用不同的设备、操作系统和浏览器来访问网页已成为常态。为了更好地适应不同环境下的用户体验需求,开发人员需要使用工具库来识别客户端的特征信息。本文…

Java数值操作

文章目录 1.数值数据类型和操作1.1 数值类型1.2 从键盘读取数值1.3 数值操作符 2.数值型字面值2.1 整形字面值2.2 浮点型字面值2.3 科学记数法 示例:显示当前时间3.增强赋值运算符4.自增和自减操作符5.数值类型转换 1.数值数据类型和操作 1.1 数值类型 类型名范围…

什么是面向对象编程

什么是面向对象编程?(OOP) ● 面向对象编程是一种基于对象概念的编程范式;(所谓的编程范式,就是代码风格,我们“如何”编写和组织代码); ● 我们使用对象来模拟&#xf…

【Cesium开发实战】飞行漫游功能的实现,可设置漫游路径,漫游高度,暂停,继续,删除路径

Cesium有很多很强大的功能,可以在地球上实现很多炫酷的3D效果。今天给大家分享一个可自定义的漫游飞行功能。 1.话不多说,先展示 漫游 2.设计思路 项目需求,可自定义漫游路径,并且设置高度,暂停,继续&…

如何制作文件的二维码?支持设置文件下载功能

现在为了能够更快的将文件分享给其他人查看,会选择将文件转换二维码的方式,用户可以通过扫描二维码在手机上预览或者下载文件到本地,能够有效的减少文件对内存的占用,在很多场景下都有所应用,那么文件转二维码具体该怎…

TCP/IP模型和OSI模型的区别(面试题)

OSI模型,是国际标准化组织ISO制定的用于计算机或通讯系统间互联的标准化体系,主要分为7个层级: 物理层数据链路层网络层传输层会话层表示层应用层 虽然OSI模型在理论上更全面,但是在实际网络通讯中,TCP/IP模型更加实…

LabVIEW电子水泵性能测试平台

开发了一种车用电子水泵性能测试平台,该平台以工控机为载体,利用LabVIEW开发上位机软件,采用PLC控制阀门和水泵等电气元件,通过RS485进行数据采集并传输到上位机。通过上位机与下位机的协同控制,实现了数据交互处理和性…

LeetCode题练习与总结:寻找旋转排序数组中的最小值Ⅱ--154

一、题目描述 已知一个长度为 n 的数组,预先按照升序排列,经由 1 到 n 次 旋转 后,得到输入数组。例如,原数组 nums [0,1,4,4,5,6,7] 在变化后可能得到: 若旋转 4 次,则可以得到 [4,5,6,7,0,1,4]若旋转 …

基于Java Web的考编论坛网站的设计与实现+lw+源码+讲解+调试+视频演示

第3章 系统分析 用户的需求以及与本系统相似的在市场上存在的其它系统可以作为系统分析中参考的资料,分析人员可以根据这些信息确定出本系统具备的功能,分析出本系统具备的性能等内容。 3.1可行性分析 尽管系统是根据用户的要求进行制作,但…

聚鼎贸易:装饰画生意能不能做起来2024

在2024年,随着人们对家居美学和个性化表达的需求日益增长,装饰画作为一种简单而直接的方式,来提升空间品味及展示个人风格的市场需求也随之扩大。许多人都对涉足这一行业抱有浓厚的兴趣,但究竟这门生意能否成功做大,需…

Unity 资源 之 战斗魔法咒语 - 第二卷(Combat Magic Spells - Volume II)

🎉Unity Asset Store 宝藏免费资源:战斗魔法咒语 - 第二卷 前言资源包内容领取兑换码 前言 各位游戏开发爱好者、Unity 开发者们,今天要给大家带来一个超棒的消息!在 Unity Asset Store 上,全新的免费资源“战斗魔法咒…

Java高级重点知识点-27-Java反射机制

文章目录 Java反射机制概述理解Class类并获取Class的实例Class 类 类的加载与ClassLoader类加载过程类的初始化触发条件类加载器的作用ClassLoader 创建运行时类的对象获取运行时类的完整结构调用运行时类的指定结构反射的应用:动态代理Proxy类AOP(Aspec…

JavaWeb系列二十一: 数据交换和异步请求(JSON, Ajax)

文章目录 官方文档official documents官方文件官方文件official documentsJSON介绍JSON快速入门JSON对象和字符串对象转换应用案例注意事项和细节 JSON在java中使用说明JSON在Java中应用场景应用实例 Ajax基本介绍Ajax是什么Ajax经典应用场景 Ajax原理示意图传统的web应用Ajax原…

Vue3打包发布,刷新出现的空白页面和错误

Vue3打包发布出现的错误:Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of text/html. Strict MIME type checking is enforced for module scripts per HTML spec. 第一次点击访问到这个路径&…

粉笔推出国内首个职教行业大模型,助力学员高效学习

7月12日,粉笔正式推出其自主研发的首个专注于职教行业的垂域大模型,并将于8月1日上线粉笔AI老师 “粉笔头”,为学员提供个性化、智能化的辅导服务。 在垂域大模型的基础上,粉笔结合10年来的教研积累、独有数据搭建RAG系统&#x…

java上手

java上手 文章目录 java上手0.注释1.简单的输出2.从控制台读取输入3.标识符4.变量5.赋值6.常量7.命名习惯 0.注释 // 单行注释 /*多行注释*/ /**对类和方法进行说明*/1.简单的输出 public class HelloWorld{public static void main(String[] args){System.out.println("…

使用MAVSDK向PX4模拟器发送启飞与降落指令

1.使用docker启动PX4模拟器 docker run --rm -it jonasvautherin/px4-gazebo-headless:1.14.3 开始启动 启动中 PX4启动成功 创建QGC连接 mavlink start -p -u 14556 -t 192.168.1.66 -o 14550 启动QGC连接PX4模拟器 在QGC中执行各种指令

TensorFlow系列:第五讲:移动端部署模型

项目地址:https://github.com/LionJackson/imageClassification Flutter项目地址:https://github.com/LionJackson/flutter_image 一. 模型转换 编写tflite模型工具类: import osimport PIL import tensorflow as tf import keras import …

电子画册制作全攻略,从零开始制作

在这个数字化时代,电子画册作为一种新型的传播媒介,已经越来越受到人们的青睐。它以生动活泼、互动性强、传播速度快等特点,迅速成为了企业宣传、个人展示的优质选择。那么,如何从零开始制作一款引人入胜的电子画册呢?…

pdf文件如何快速英文转中文?

要将 PDF 文件中的英文内容转换为中文,你可以使用以下几种方法: 1、在线翻译工具: 使用网上的免费在线翻译工具,如Google翻译、百度翻译或有道翻译,将整个 PDF 文档粘贴到工具中进行翻译。 2、专业翻译软件&#xf…