微信小程序 -- 页面间通信

前言

今天我们来说下微信小程序的页面间通信:

  1. 通过url传参实现页面间单向通信
  2. 通过getCurrentPages()页面栈实现页面间单向通信
  3. 通过EventChannel实现页面间双向通信
1、url传参

我们知道页面之间的跳转可以通过路由组件来实现,其中组件的属性url就是要跳转到页面的路径。
我们可以通过在路径中添加需要传递的数据来实现页面间数据通信

//数据传递
wx.navigateTo({url: '../../followUp/index?aa=1256&bb=jkkk'
})
//数据接收
onLoad: function (options) {const {info} = options;
},
2、getCurrentPages()

获取当前页面栈。数组中第一个元素为首页,最后一个元素为当前页面。
通过获取到相应的页面栈对象,然后根据业务需求,执行具体操作。

//数据传递
let curPages = getCurrentPages();//获取当前页面栈列表
var prevPage = curPages[curPages.length - 2];//上一页面栈对象
prevPage.setData({aa:'111111',bb:'2222222',
});
prevPage.updateInfo();
2、EventChannel

如果一个页面(B)由另一个页面(A)通过 wx.navigateTo 打开,这两个页面间将建立一条数据通道:
被打开的页面可以通过 this.getOpenerEventChannel() 方法来获得一个 EventChannel 对象;
wx.navigateTo 的 success 回调中也包含一个 EventChannel 对象。
这两个 EventChannel 对象间可以使用 emit 和 on 方法相互发送、监听事件。

//--------------------------页面A--------------------------
wx.navigateTo({url: '../../followUp/index',events: {//接收页面B传递的数据two: function (data) {console.log(data)},},success:function(res){//向页面B传递数据res.eventChannel.emit('one', { data: 'data one' })},
})
// --------------------------页面B--------------------------
//接收数据
const eventChannel = this.getOpenerEventChannel()
eventChannel.on('one', function (data) {console.log(data)
})
//发送数据
const eventChannel = this.getOpenerEventChannel()
eventChannel.emit('two', { data: 'data two'});

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

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

相关文章

攻防世界-fakebook

打开题目链接 尝试弱口令登录 失败 随便注册 点击admin后跳转到下面这个页面 显示的是注册用户信息,观察url发现no1,猜测存在注入 用单引号测试一下,报错,确实存在SQL注入 使用order by 判断字段数 ?no1 order by 5 5的时候…

2.2.3 vim操作合集

1 vim VIM 是 Linux 系统上一款文本编辑器,学习 VIM 最好的文档,应该是阅读学习 VIM 的帮助文档,可以使用本地的帮助文件(vim--->:help),或者使用在线帮助文档。同时针对vim的使用,相应的相书籍也很多,如下 2 vim操作模式 命令模式:默认模式,该模式下可以移动光标…

【Java】微服务——Nacos配置管理(统一配置管理热更新配置共享Nacos集群搭建)

目录 1.统一配置管理1.1.在nacos中添加配置文件1.2.从微服务拉取配置1.3总结 2.配置热更新2.1.方式一2.2.方式二2.3总结 3.配置共享1)添加一个环境共享配置2)在user-service中读取共享配置3)运行两个UserApplication,使用不同的pr…

【云备份项目】【Linux】:环境搭建(g++、json库、bundle库、httplib库)

文章目录 1. g 升级到 7.3 版本2. 安装 jsoncpp 库3. 下载 bundle 数据压缩库4. 下载 httplib 库从 Win 传输文件到 Linux解压缩 1. g 升级到 7.3 版本 🔗链接跳转 2. 安装 jsoncpp 库 🔗链接跳转 3. 下载 bundle 数据压缩库 安装 git 工具 sudo yum…

C++ 字符串

在本文中,您将学习如何在C中处理字符串。您将学习声明它们,对其进行初始化以及将它们用于各种输入/输出操作。 字符串是字符的集合。C 编程语言中通常使用两种类型的字符串: 作为字符串类对象的字符串(标准C 库字符串类&#xff0…

小米、华为、iPhone、OPPO、vivo如何在手机让几张图拼成一张?

现在很多手机自带的相册APP已经有这个拼图功能了。 华为手机的拼图 打开图库,选定需要拼图的几张图片后,点击底部的【创作】,然后选择【拼图】就可以将多张图片按照自己想要的位置,组合在一起。 OPPO手机的拼图 打开相册&#…

Nginx配置文件的通用语法介绍

要是参考《Ubuntu 20.04使用源码安装nginx 1.14.0》安装nginx的话,nginx配置文件在/nginx/conf目录里边,/nginx/conf里边的配置文件结构如下图所示: nginx.conf是主配置文件,它是一个ascii文本文件。配置文件由指令(…

【Python 1】

当我们编写Python代码时,我们得到的是一个包含Python代码的以.py为扩展名的文本文件 要运行代码,就需要Python解释器去执行.py文件 CPython用>>>作为提示符,而IPython用In [序号]:作为提示符 在Python交互模式下输入exit()并回车&…

【数据结构】二叉树--顺序结构及实现 (堆)

目录 一 二叉树的顺序结构 二 堆的概念及结构 三 堆的实现 1 包含所有接口 (Heap.h) 2 初始化,销毁和交换(Heap.c) 3 向上调整(Heap.c) 4 插入(Heap.c) ​5 向下调整(Heap.c) 6 删除(Heap.c) ​7 打印&#…

DevOps:自动化部署和持续集成/持续交付(CI/CD)

DevOps:自动化部署和持续集成/持续交付(CI/CD) 在现代软件开发领域,DevOps(Development和Operations的组合)已经成为一个不可或缺的概念。它代表了一种将软件开发和运维(Operations&#xff09…

数据统计--图形报表--ApacheEcharts技术 --苍穹外卖day10

Apache Echarts 营业额统计 重点:已完成订单金额要排除其他状态的金额 根据时间选择区间 设计vo用于后端向前端传输数据,dto用于后端接收前端发送的数据 GetMapping("/turnoverStatistics")ApiOperation("营业额统计")public Result<TurnoverReportVO…

209.Flink(四):状态,按键分区,算子状态,状态后端。容错机制,检查点,保存点。状态一致性。flink与kafka整合

一、状态 1.概述 算子任务可以分为有状态、无状态两种。 无状态:filter,map这种,每次都是独立事件有状态:sum这种,每次处理数据需要额外一个状态值来辅助。这个额外的值就叫“状态”2.状态的分类 (1)托管状态(Managed State)和原始状态(Raw State) 托管状态就是由…

HDLbits: Count clock

目前写过最长的verilog代码&#xff0c;用了将近三个小时&#xff0c;编写12h显示的时钟&#xff0c;改来改去&#xff0c;估计只有我自己看得懂&#xff08;吐血&#xff09; module top_module(input clk,input reset,input ena,output pm,output [7:0] hh,output [7:0] mm,…

Java RPC调用: 远程过程调用的实现与应用

远程过程调用&#xff08;RPC&#xff09;是一种允许程序在不同计算机之间进行通信的协议。它通过将本地函数调用转化为远程函数调用来实现分布式计算。在Java中&#xff0c;可以使用一些RPC框架实现远程过程调用&#xff0c;如Apache Thrift和gRPC。 用法: Java中的RPC调用可…

叶工好容6-自定义与扩展

本篇主要介绍扩展的本质以及CRD与Operator之间的区别&#xff0c;帮助大家理解相关的概念以及知道要进行扩展需要做哪些工作。 CRD&#xff08;CustomerResourceDefinition&#xff09; 自定义资源定义,代表某种自定义的配置或者独立运行的服务。 用户只定义了CRD没有任何意…

课题学习(五)----阅读论文《抗差自适应滤波的导向钻具动态姿态测量方法》

一、简介 抗差自适应滤波&#xff1a;利用等价权函数和自适应因子合理的分配信息&#xff0c;有效地滤除钻具振动对动态姿态测量的影响。、   针对导向钻井工具动态测量受钻具振动的影响而导致测量不准确的问题&#xff0c;提出一种抗差自适应滤波的动态空间姿态测量方法。通…

MySQL:主从复制-基础复制(6)

环境 主服务器 192.168.254.1 从服务器&#xff08;1&#xff09;192.168.254.2 从服务器&#xff08;2&#xff09;192.168.253.3 我在主服务器上执行的操作会同步至从服务器 主服务器 yum -y install ntp 我们去配置ntp是需要让从服务器和我们主服务器时间同步 sed -i /…

WPS/word 表格跨行如何续表、和表的名称

1&#xff1a;具体操作&#xff1a; 将光标定位在跨页部分的第一行任意位置&#xff0c;按下快捷键ctrlshiftenter&#xff0c;就可以在跨页的表格上方插入空行&#xff08;在空行可以写&#xff0c;表1-3 xxxx&#xff08;续&#xff09;&#xff09; 在空行中输入…

好物周刊#19:开源指北

https://github.com/cunyu1943/JavaPark https://yuque.com/cunyu1943 村雨遥的好物周刊&#xff0c;记录每周看到的有价值的信息&#xff0c;主要针对计算机领域&#xff0c;每周五发布。 一、项目 1. Vditor 一款浏览器端的 Markdown 编辑器&#xff0c;支持所见即所得、…

php实战案例记录(5)$_REQUEST是一个超全局变量

在PHP中&#xff0c;$_REQUEST是一个超全局变量&#xff0c;用于收集HTML表单提交的数据。它可以获取通过GET、POST或COOKIE方法提交的数据。 $_REQUEST变量是一个关联数组&#xff0c;它的键是表单元素的名称&#xff0c;值是用户输入的数据。通过$_REQUEST变量&#xff0c;可…