当前位置: 首页 > news >正文

微信小程序常用的传值

1.通过 URL 传参

在页面跳转时,可以在 URL 中携带参数进行传递,然后在目标页面的 onLoad 生命周期中获取参数。

// 在页面 A 中跳转到页面 B 并传递参数
wx.navigateTo({url: '/pages/detail/index?id=123'
});// 在页面 B 的 onLoad 生命周期中获取参数
onLoad: function (options) {console.log(options.id); // 输出 123
}

2.通过 navigateTo 方法传递数据:

通过 navigateTo 方法传递数据的方式比较常见,可以通过 wx.setStorageSync 方法在当前页面设置数据,然后在目标页面的 onLoad 生命周期中使用 wx.getStorageSync 方法获取数据。以下是一个示例代码来演示这种传递数据的方式:

在页面 A 中设置数据并跳转到页面 B:

// 在页面 A 中设置数据
wx.setStorageSync('key', 'value');// 使用 navigateTo 方法跳转到页面 B
wx.navigateTo({url: '/pages/pageB/pageB'
});

在页面 B 的 onLoad 生命周期中获取数据:

Page({onLoad: function(options) {// 在页面 B 的 onLoad 生命周期中获取数据var data = wx.getStorageSync('key');console.log(data); // 输出 'value'}
});

3.通过全局变量传值

可以在 app.js 文件中定义全局变量,然后在任何页面中都可以访问和修改这些全局变量。

在 app.js 文件中定义全局变量:

// app.js
App({globalData: {userInfo: null}
});

在任意页面中访问和修改全局变量: 

// 在任意页面中访问和修改全局变量
// 设置全局变量
getApp().globalData.userInfo = { name: 'Alice', age: 30 };
// 获取全局变量
console.log(getApp().globalData.userInfo); // 输出 { name: 'Alice', age: 30 }

4.通过事件总线传值

可以使用事件总线进行页面间通信,创建一个事件总线实例,然后在需要传递数据的页面发送事件,在需要接收数据的页面监听事件。

1.创建一个事件总线实例:

// eventBus.js
const EventBus = {events: {},on: function(event, callback) {if (!this.events[event]) {this.events[event] = [];}this.events[event].push(callback);},emit: function(event, data) {if (this.events[event]) {this.events[event].forEach(callback => {callback(data);});}}
};module.exports = EventBus;

2.在发送数据的页面发送事件

// pageA.js
const eventBus = require('../../utils/eventBus');// 发送事件
eventBus.emit('dataUpdated', { name: 'Bob', age: 25 });

3.在接收数据的页面监听事件:

// pageB.js
const eventBus = require('../../utils/eventBus');Page({onLoad: function() {// 监听事件eventBus.on('dataUpdated', (data) => {console.log(data); // 输出 { name: 'Bob', age: 25 }});}
});

这些都是微信小程序中常用的页面间传值方式

相关文章:

微信小程序常用的传值

1.通过 URL 传参 在页面跳转时,可以在 URL 中携带参数进行传递,然后在目标页面的 onLoad 生命周期中获取参数。 // 在页面 A 中跳转到页面 B 并传递参数 wx.navigateTo({url: /pages/detail/index?id123 });// 在页面 B 的 onLoad 生命周期中获取参数…...

SQL面试真题解答 数据统计分析,求“同比、环比”等(SQL窗口函数使用)

SQL面试真题解答 数据统计分析,求“同比、环比”等(SQL窗口函数使用) 环比、环比增长率、同比、同比增长率,根据百度百科上的 说明: 环比增长率 环比增长率,一般是指和上期相比较的增长率。 环比增长率&a…...

【递归、搜索与回溯】floodfill算法二

floodfill算法二 1.被围绕的区域2.太平洋大西洋水流问题3.扫雷游戏4.衣橱整理 点赞👍👍收藏🌟🌟关注💖💖 你的支持是对我最大的鼓励,我们一起努力吧!😃😃 1.被围绕的区域…...

Dataease安装,配置Jenkins自动部署

Dataease安装,配置Jenkins自动部署 一.安装Dataease 安装前准备:1.Ubuntu20.04 LTS国内源安装指定版本Docker 2.docker-compose安装 下载离线安装的安装包,下载地址:https://community.fit2cloud.com/#/download/dataease/v1-…...

关于IDEA启动报错 【JAVA_HOME does not point to a valid JM installation】

希望文章能给到你启发和灵感~ 感谢支持和关注~ 阅读指南 一、基础环境说明1.1 硬件环境1.2 软件环境 二、起因 一、基础环境说明 考虑环境因素不同,大家适当的对比自己的软硬件环境情况分析~ 1.1 硬件环境 MacOS Monterey 版本 1…...

设置小蓝熊的CPU亲和性、CPU优先级再设置法环的CPU亲和性

# 适用于Windows系统 # 时间 : 2024-06-28 # 作者 : 三巧(https://blog.csdn.net/qq_39124701) # 文件名 : 设置小蓝熊的CPU亲和性、CPU优先级再设置法环的CPU亲和性.ps1 # 使用方法: 打开记事本,将所有代码复制到记事本中,保存文件时候修改文件后…...

Oracle中的序列(Sequence)是一种数据库对象

Oracle中的序列(Sequence)是一种数据库对象,用于生成数字序列,通常用于为主键列生成唯一、连续的数值。以下是一些使用序列的案例: 1. **为主键生成唯一值**: 在Oracle中,序列最常用的场景是…...

热点观察 | 《姜饼人王国》新作来袭、《Monopoly GO!》荣登5月全球畅销榜榜首

本周出海热点: 1. 中国品牌借欧洲杯打响知名度 2. 米哈游玩家切割二次元 3. 6月27日,Steam游戏《六月衷曲》上线TapTap 4. 《Monopoly GO!》荣登5月全球畅销榜榜首 5. 《地下城与勇士》拿下本周亚洲T1市场畅销榜冠军 6. 《姜饼人王国》新作强势登顶…...

智能网络构建:探索大模型在网络领域的应用

网络领域以其高度复杂性和快速迭代为特点,完成从网络设计、配置、诊断到安全的网络任务需要广泛的专业知识。这些任务的固有复杂性,加上网络技术和协议不断变化的格局,为传统基于机器学习的方法带来了显著的障碍。这些方法在泛化和自动化网络…...

C++编程逻辑讲解step by step:定义一个Person类,它的每个对象表示一个人。

题目 定义一个Person类,它的每个对象表示一个人。数据成员必须包含姓名、出生年份、死亡年份&#xff0c;一个构造函数&#xff0c;一析构函数&#xff0c;读取数据的成员函数&#xff0c;一个print()成员函数显示所有数据。 #include <iostream> using namespace std;…...

DBdoctor产品介绍

基本信息 DBdoctor是一款企业级数据库监控、巡检、性能诊断、SQL审核与优化平台&#xff0c;致力于解决一切数据库性能问题。采用eBPF技术可对数据库做细粒度的扫描&#xff0c;帮助您一分钟内找到数据库性能问题&#xff0c;实现性能诊断百倍提效。针对数据库性能诊断门槛高、…...

一加Ace3 刷机救砖简化说明

注意&#xff1a;工具使用英文目录&#xff0c;支持救砖和降级。PJE110国行版&#xff0c;CPH2609国际版。目前国行版不能完美转换国际版&#xff0c;每次升级都需要刷oplusstanvbk&#xff0c;不建议使用。跨国转换或ROOT一定先解锁Bootloader&#xff0c;可以使用“一加全能工…...

【服务器05】之【登录/注册账号成功转至游戏场景】

Unity登录注册数据库 打开【服务器01】的文章项目 导入新UI系统 点击2D 双击输入栏位置 修改输入框尺寸及位置 放大字体 修改默认输入文字 发现中文字变成了口口口口 原因是新UI系统不支持中文&#xff0c;解决这个问题需要更换字体 并且修改输入时字体大小 我们取电脑中找Fon…...

平价蓝牙耳机推荐性价比高,性价比高的蓝牙耳机学生党推荐

市场上的蓝牙耳机价格从几十元到几百甚至上千不等&#xff0c;性能与价格也呈现多样化&#xff0c;对于学生党来说&#xff0c;一个理想的选择是那些性价比高的平价蓝牙耳机&#xff0c;它们在不牺牲必要功能的同时&#xff0c;提供了可接受的音质和足够的便利性&#xff0c;接…...

【华为战报】5月、6月HCIP考试战报!

华为认证&#xff1a;HCIA-HCIP-HCIE 点击查看&#xff1a; 【华为战报】4月 HCIP考试战报&#xff01; 【华为战报】2月、3月HCIP考试战报&#xff01; 【华为战报】11月份HCIP考试战报&#xff01; 【HCIE喜报】HCIE备考2个月丝滑通关&#xff0c;考试心得分享&#xff…...

OBD诊断

文章目录 OBD 参考标准OBD 服务OBD服务中的DTCOBD服务中0x03和0x07的区别参考 OBD 参考标准 OBD的标准&#xff1a; ISO 15031 Road Vehicles-Communication between vehicle and external equipment for emission-related diagnostics OBD 服务 序号ID服务说明服务详解10x0…...

Elasticsearch 聚合查询

Hi~&#xff01;这里是奋斗的小羊&#xff0c;很荣幸您能阅读我的文章&#xff0c;诚请评论指点&#xff0c;欢迎欢迎 ~~ &#x1f4a5;&#x1f4a5;个人主页&#xff1a;奋斗的小羊 &#x1f4a5;&#x1f4a5;所属专栏&#xff1a;C语言 &#x1f680;本系列文章为个人学习…...

adb remount fails - mount: ‘system‘ not in /proc/mounts 解决办法

mount -o rw,remount /挂载根 mount -o ro,remount /将状态重置为“ro” 以下是我个人的一些话 我热衷于在网络上分享我遇到的问题和解决方案。如果你有任何问题或需要帮助&#xff0c;欢迎留言交流&#xff0c;在共同学习的道路上一起进步。我很高兴结识那些在学习上积极进取…...

百元蓝牙耳机推荐2024哪个好?蓝牙耳机性价比之王推荐

现在的百元价位的蓝牙耳机成为了许多消费者入门级的选择&#xff0c;它不仅需要满足基础的通话需求&#xff0c;更要在音质、舒适度、续航能力等多方面达到一定的标准&#xff0c;随着技术的发展和市场的竞争激烈&#xff0c;各大品牌在这一价格区间推出了极具竞争力的产品&…...

Spring项目报错解读与全部报错详解

你好,我是Qiuner. 为帮助别人少走弯路和记录自己编程学习过程而写博客 这是我的 github https://github.com/Qiuner ⭐️ ​ gitee https://gitee.com/Qiuner &#x1f339; 如果本篇文章帮到了你 不妨点个赞吧~ 我会很高兴的 &#x1f604; (^ ~ ^) 想看更多 那就点个关注吧 我…...

10秒教会你mysql的连接

连接MySQL数据库通常可以通过多种方法实现&#xff0c;以下是几种常见的方法&#xff0c;我将按照您的要求以清晰、分点的方式归纳说明&#xff1a; 1. 使用MySQL命令行客户端 打开终端或命令提示符&#xff1a;首先&#xff0c;打开您的计算机上的终端或命令提示符窗口。输入…...

万物皆可爬——亮数据代理IP+Python爬虫批量下载百度图片助力AI训练

&#x1f482; 个人网站:【 摸鱼游戏】【神级代码资源网站】【导航大全】&#x1f91f; 一站式轻松构建小程序、Web网站、移动应用&#xff1a;&#x1f449;注册地址&#x1f91f; 基于Web端打造的&#xff1a;&#x1f449;轻量化工具创作平台&#x1f485; 想寻找共同学习交…...

OpenCv形态学(一)

目录 形态学转换 结构元素 腐蚀 膨胀 开运算 闭运算 形态学梯度 顶帽 黑帽 图像轮廓 查找轮廓 绘制轮廓 形态学转换 形态变换是一些基于图像形状的简单操作。通常在二值图像上执行。它需要两个输入&#xff0c;一个是我们的原始图像&#xff0c;第二个是决定操作性…...

CSS基础汇总

CSS 1. 选择器 标签选择器 通过标签名找标签&#xff08;把指定的样式应用到某一个、组、类标签上&#xff09; id选择器 通过id属性值找标签&#xff0c;关键符号#id值{样式} 复合选择器 1、并列选择器&#xff1a;关键符号&#xff0c;用法&#xff1a;选择器1&#xff0c…...

cocos creator让所有button点击时播放音效

原理&#xff1a; 利用prototype属性&#xff0c;通过重写 cc.Button.prototype._onTouchEnded 方法&#xff0c;以便在按钮被点击时播放音频。通过重写其 _onTouchEnded 方法&#xff0c;可以添加自定义行为&#xff0c;如播放音频。 概念解释&#xff1a; prototype&#…...

mybatisplus自带的雪花算法(IdType.ASSIGN_ID)无法自动生成弊端缺点,以及改进方法

前言 今日在使用mybatisplus的雪花算法自动给id赋值时发现怎么都是null的情况&#xff0c;这尼玛测了半天&#xff0c;终于发现巨坑&#xff0c;废话不多说&#xff0c;直接上干货 IService.save 只有调用IService中的save方法才能正常生成id&#xff0c;像IService.saveBatc…...

单位转换:将kb转换为 MB ,GB等形式

写法一&#xff1a; function formatSizeUnits(kb) {let units [KB, MB, GB, TB, PB,EB,ZB,YB];let unitIndex 0;while (kb > 1024 && unitIndex < units.length - 1) {kb / 1024;unitIndex;}return ${kb.toFixed(2)} ${units[unitIndex]}; } console.log(for…...

优思学院|「按计划推动型」与「需求拉动型」的生产模式

针对生产架构做对比分类的用语&#xff0c;主要有按计划推进型与需求拉动型。 「按计划推动型」与「需求拉动型」两者乃是生产架构上常使用、成对比的两个用语。不过&#xff0c;有时不只用来指单纯的生产现场架构&#xff0c;也有人把它应用在更广泛的生产架构设计上。 按计划…...

解释什么是lambda函数?它有什么好处?

&#x1f49d;&#x1f49d;&#x1f49d;欢迎莅临我的博客&#xff0c;很高兴能够在这里和您见面&#xff01;希望您在这里可以感受到一份轻松愉快的氛围&#xff0c;不仅可以获得有趣的内容和知识&#xff0c;也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…...

码农:如何快速融入团队

问题&#xff1a; 码农如何快速融入团队&#xff1f; 记住一个标准&#xff1a;能干事、能抗事。 总结一个字&#xff1a; 靠谱。 适用范围&#xff1a;新手码农、老司机码农、测试、DBA、运维、产品经理、项目经理、架构师、技术专家、。。。。适用于任何行业的打工者。 下面要…...