当前位置: 首页 > 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; (^ ~ ^) 想看更多 那就点个关注吧 我…...

自动化测试(十二) 分布式系统测试-缓存-注册中心与链路追踪验证

分布式系统测试&#xff1a;缓存、注册中心与链路追踪验证上篇咱们搞定了消息队列测试&#xff0c;今天继续深入分布式系统的其他组件——Redis缓存、服务注册中心、分布式链路追踪。这些"基础设施"的测试往往被忽略&#xff0c;但出了问题定位起来最头疼。一、Redis…...

windows构建mamba环境

收集必要的whl文件 在某&#x1f41f;等平台或者是精密搜索找到以下whl文件 对于3.10 python triton-2.0.0-cp310-cp310-win_amd64.whl causal_conv1d-1.1.1-cp310-cp310-win_amd64.whl mamba_ssm-1.1.3-cp310-cp310-win_amd64.whl 对于3.11 python FuouM/mamba-ssm-windo…...

对比直接使用原厂API,Taotoken在计费透明度上的体验

&#x1f680; 告别海外账号与网络限制&#xff01;稳定直连全球优质大模型&#xff0c;限时半价接入中。 &#x1f449; 点击领取海量免费额度 对比直接使用原厂API&#xff0c;Taotoken在计费透明度上的体验 对于个人开发者而言&#xff0c;在项目开发中集成大模型能力时&am…...

紧急预警:Midjourney即将下架Nihonga相关风格标签?(内部消息+已存档的5类不可再生提示词组合,仅限今日开放获取)

更多请点击&#xff1a; https://intelliparadigm.com 第一章&#xff1a;Nihonga风格在Midjourney中的历史定位与美学内核 Nihonga&#xff08;日本画&#xff09;作为明治维新后确立的现代民族绘画体系&#xff0c;以天然矿物颜料、金箔银箔、胶质媒介及传统和纸为物质基础&…...

FanControl中文设置终极指南:3个简单步骤让Windows风扇控制说中文

FanControl中文设置终极指南&#xff1a;3个简单步骤让Windows风扇控制说中文 【免费下载链接】FanControl.Releases This is the release repository for Fan Control, a highly customizable fan controlling software for Windows. 项目地址: https://gitcode.com/GitHub_…...

轴承剩余寿命预测 | 基于BP神经网络的轴承剩余寿命预测MATLAB实现!

研究背景 该代码基于IEEE PHM 2012数据挑战赛的轴承全寿命加速退化实验数据&#xff0c;旨在利用数据驱动方法预测滚动轴承的剩余使用寿命&#xff08;RUL&#xff09;。实验中轴承在恒定负载下持续运行至失效&#xff0c;期间通过水平/竖直加速度传感器以25.6 kHz采样频率每隔…...

can消息的大小端对源码的影响

下图为小端intel型信号&#xff0c;其dbc文件部分源码为&#xff1a;BO_ 1 id_0x1: 8 Vector__XXXSG_ aaa : 0|121 (1,0) [0|0] "" Vector__XXX&#xff0c;这里的0代表的是起始位置为0&#xff08;起始0->7,8->12为高位)如果将该信号改为大端motorola型&#…...

从极坐标栅格到地面点云:一种基于坡度与邻域一致性的分割实践

1. 极坐标栅格构建&#xff1a;自动驾驶的"地面扫描仪" 想象你正在玩一款赛车游戏&#xff0c;车辆需要自动识别哪些是能开的平坦路面&#xff0c;哪些是必须绕开的障碍物。现实中自动驾驶车辆面临同样的挑战&#xff0c;而极坐标栅格就是它的"地面扫描仪"…...

LightGBM参数太多不会调?一份针对分类问题的‘避坑’指南与核心参数详解

LightGBM分类任务调参实战&#xff1a;从参数误区到精准优化 第一次接触LightGBM时&#xff0c;我被它琳琅满目的参数列表吓到了——光是官方文档列出的就有80多个可调参数。记得当时为了预测用户流失率&#xff0c;我直接把XGBoost的代码换成LightGBM&#xff0c;结果AUC反而下…...

AMD Ryzen硬件调试终极指南:深入SMU Debug Tool的完整实战应用

AMD Ryzen硬件调试终极指南&#xff1a;深入SMU Debug Tool的完整实战应用 【免费下载链接】SMUDebugTool A dedicated tool to help write/read various parameters of Ryzen-based systems, such as manual overclock, SMU, PCI, CPUID, MSR and Power Table. 项目地址: ht…...