【微信小程序】传参存储

 

目录

一、本地数据存储 wx.setStorage wx.setStorageSync

 1.1、异步缓存 存取数据

1.2、同步缓存 存取数据

二、使用url跳转路径携带参数

2.1、 wx.redirectTo({})      

2.2、 wx.navigateTo({})   

2.3、 wx.switchTab({})

2.4 、wx.reLaunch({})

 2.5、组件跳转

三、globalData(全局)


一、本地数据存储 wx.setStorage wx.setStorageSync

在微信小程序中,大多数的数据操作都是异步的,包括像 wx.setStorage 这样的存储数据的方法。异步操作意味着当调用这些方法时,程序会继续执行后续的代码,而不会等待这些方法执行完成。当这些异步方法执行完成时,会通过回调函数来返回结果或执行后续逻辑。

而同步操作则是指方法执行时会阻塞后续代码的执行,直到该方法执行完成才会继续执行后续代码。

针对 wx.setStorage 方法,它是一个异步的数据存储方法,优势和区别主要体现在以下几点:

  1. 非阻塞:异步方法不会阻塞后续代码的执行,可以提高程序的响应速度和性能。

  2. 避免页面假死:如果使用同步方法进行数据存储,可能会导致页面假死,用户体验会受到影响。

  3. 更好的并发控制:异步方法适用于需要处理大量并发请求的场景,能更好地控制多个操作之间的执行顺序和结果处理。

总的来说,异步方法能够更好地保持程序的响应性和用户体验,而同步方法可能会导致页面假死、响应迟缓等问题。因此,在小程序开发中,推荐使用异步方法进行数据操作,如 wx.setStorage,确保程序的流畅性和性能

 1.1、异步缓存 存取数据
  wx.setStorage({           // 异步存储数据
      key: 'user',
      data: 'zhangsan',
    })

    wx.getStorage({         //异步取出数据
      key: 'user',
      success: function(res) {
        console.log(res)
      },
    });
1.2、同步缓存 存取数据
 wx.setStorageSync('name', '张三')    //同步存储数据

wx.getStorageSync('id')           //同步取出数据

二、使用url跳转路径携带参数

2.1、 wx.redirectTo({})      

        不允许跳转到 tabBar

///关闭当前页面跳转 
wx.redirectTo({
      url:"/pages/index/index?id=999"
 })
//跳转的页面上js 获取
  onLoad(options) {
    console.log(options);
},
2.2、 wx.navigateTo({})   

        不允许跳转到 tabBar

//保留当前页面,跳转到应用内的某个页面
wx.navigateTo({
      url: '/pages/user/index?id=999'
    });
//跳转的页面上js 获取
  onLoad(options) {
    console.log(options);
},
2.3、 wx.switchTab({})

    只能跳转到tabBar页面且不能携带参数

   wx.switchTab({
      url: '/pages/index/index'
  })

2.4 、wx.reLaunch({})

    关闭所有页面,打开到应用内的某个页面

   wx.reLaunch({
      url: '/pages/index/index?id=999'
  })
//跳转的页面上js 获取
  onLoad(options) {
    console.log(options);
},
 2.5、组件跳转

效果跟上面一模一样,注意事项也是一样,只是形式不同罢了


<view>
  <navigator open-type="switchTab" url="/a">/navigator>
  <navigator open-type="reLaunch" url="/a?id=1"></navigator>
  <navigator open-type="redirectTo" url="/a?id=1"></navigator>
  <navigator open-type="navigateTo" url="/a?id=1"></navigator>
</view>

三、globalData(全局)

  globalData类似vue中的vuex,当globalData中数据发生改变时,页面上之前赋值信息不回发生改变,如果要求改变的话也需要改变,可以在切换页面的时候 在onShow中再重新赋值。

// app.js 类似vuex 全局可以
App({
  globalData:{},
})
// a.js
const app = getApp();
app.globalData.token='sdasdasd';
//b.js
const app = getApp();
console.log(app.globalData.token) //sdasdasd

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

自动化测试框架robotframework安装教程

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 1.下载安装robotframework2.安装wxpython3.在线安装robotframework-ride4.安装selenium2library5.安装databaselibrary7.安装PyMySql8.下载浏览器驱动程序*9.启动ro…

C++:Stack和Queue的模拟实现

创作不易&#xff0c;感谢三连&#xff01; 一、容器适配器 适配器是一种设计模式(设计模式是一套被反复使用的、多数人知晓的、经过分类编目的、代码设计经验的总结)&#xff0c;该种模式是将一个类的接口转换成客户希望的另外一个接口。 就如同是电源适配器将不适用的交流电…

阿里云服务器怎么使用?3分钟搭建网站教程2024新版

使用阿里云服务器快速搭建网站教程&#xff0c;先为云服务器安装宝塔面板&#xff0c;然后在宝塔面板上新建站点&#xff0c;阿里云服务器网aliyunfuwuqi.com以搭建WordPress网站博客为例&#xff0c;来详细说下从阿里云服务器CPU内存配置选择、Web环境、域名解析到网站上线全流…

代码随想录第53天|● 1143.最长公共子序列 ● 1035.不相交的线 ● 53. 最大子序和 动态规划

文章目录 ● 1143.最长公共子序列思路&#xff1a;代码一&#xff1a;dp二维数组代码二&#xff1a;滚动数组 ● 1035.不相交的线思路&#xff1a;代码&#xff1a;&#xff08;滚动数组&#xff09; ● 53. 最大子序和 动态规划思路代码&#xff1a;代码二&#xff1a;单一元素…

许多人可能还不了解这个信息差:美赛的第一批 EI 已经录用,不用再犹豫啦

格局打开&#xff0c;美赛论文转学术论文发表 &#x1f680;&#x1f680; 各位同学&#xff0c;美赛已经结束了一段时间&#xff0c;你们是否还在焦急地等待最终成绩的公布&#xff1f;一些有远见的同学已经提前收到了一份喜讯&#xff1a;他们的美赛论文已被转化为学术论文并…

2024年博管办香江学者、澳门青年学者、中德博士后 交流项目申报工作启动

近日&#xff0c;中国博士后科学基金会官网发布了2024年博士后国&#xff08;境&#xff09;外学术交流项目申报指南&#xff0c;以下知识人网小编仅转载香江学者计划、澳门青年学者计划、中德博士后交流项申报指南并做重点解读。 知识人网整理 各省、自治区、直辖市及新疆生产…

Sora的双重边缘:视频生成的革新与就业的再思考

随着科技的日新月异&#xff0c;人工智能&#xff08;AI&#xff09;和机器学习&#xff08;ML&#xff09;技术如潮水般涌入我们的日常生活&#xff0c;为各个领域带来了翻天覆地的变化。在这一浪潮中&#xff0c;Sora作为一款前沿的AI视频生成工具&#xff0c;凭借其高度逼真…

vue 使用 PrintJs 实现打印pdf效果

一、print.js介绍 Print.js主要是为了帮助我们直接在应用程序中打印PDF文件&#xff0c;而无需离开界面&#xff0c;并且不使用嵌入。对于用户不需要打开或下载PDF文件的特殊情况&#xff0c;他们只需要打印它们。 例如&#xff0c;当用户请求打印在服务器端生成的报告时&…

便携式测速仪的工作原理

TH-LS5】便携式测速仪的工作原理主要基于多普勒效应。当测速仪发射电磁波并碰触到物体时&#xff0c;电磁波会被反射回来。如果触碰到的物体有朝向或背向的位移运动&#xff0c;那么测速仪发射与反射回来的电磁波之间会存在一个频率差。这个频率差会被测速仪捕获&#xff0c;并…

上海雷卯可以解决YPbPr/ YCbCr接口 ESD/EOS静电浪涌问题

YPbPr /YCbCr 接口传输的是视频信号&#xff0c;不传输音频信号。YPbPr 和 YCbCr 都是视频信号的颜色编码格式&#xff0c;多应用于机顶盒&#xff08;Set-top box&#xff09;,TV电视&#xff0c;投影仪&#xff0c;游戏机和DVD播放器。 YPbPr&#xff1a;是一种模拟视频接口…

2.DOM-事件基础(注册事件、tab栏切换)(案例:注册、轮播图)

案例 注册事件 <!-- //disabled默认情况用户不能点击 --><input type"button" value"我已阅读用户协议(5)" disabled><script>// 分析&#xff1a;// 1.修改标签中的文字内容// 2.定时器// 3.修改标签的disabled属性// 4.清除定时器// …

前端实现扫同一个二维码,可以跳转到微信小程序和支付宝小程序?

前端如何实现扫同一个二维码&#xff0c;可以跳转到微信小程序和支付宝小程序&#xff1f; 不知道大家有没有遇到过这样的需求&#xff1a;扫描同一个二维码&#xff0c;要如何区分是微信还是支付宝扫码。然后进入微信和支付宝的小程序&#xff1f;&#xff1f; 就我目前所知道…

部署 LVS(nginx)+keepalived高可用负载均衡集群

目录 一、集群的概述 1、什么是集群 2、普通集群与负载均衡集群 2.1 普通集群&#xff08;Regular Cluster&#xff09; 2.2 负载均衡集群&#xff08;Load Balancing Cluster&#xff09; 2.3 高可用集群&#xff08;High Availability Cluster&#xff09; 2.4 区别 …

网站开发之旅:从概念到实现

在我成为一名专业的网站开发者的过程中&#xff0c;我有幸参与了多个激动人心的项目。其中&#xff0c;一个我印象尤为深刻的经历是&#xff0c;开发一个名为“文案推荐网”的主题网站&#xff08;www.zimeiti.love&#xff09;。这个项目不仅让我深入了解了网站开发的各个方面…

JVM优化

1. JVM内存 JVM内存&#xff1a; 1&#xff0c;虚拟机栈&#xff1a;每个线程有一个私有的栈&#xff0c;随着线程的创建而创建。每个方法会创建一个栈帧&#xff0c;栈帧中存放了局部变量表&#xff08;基本数据类型和对象引用&#xff09;、操作数栈、方法出口等 栈的大小可…

构建cef基本框架及构建过程中的参数说明

文章目录 准备源码版本编译版本结构编译过程写了好多CEF的内容了,发现一个最初的CEF helloworld的过程都没有写,也就是如何搭建这个CEF框架。今天把这个过程记录一下。 准备源码版本 在度娘上搜cef源码,一般得到的是https://bitbucket.org/chromiumembedded/cef/这个网址,…

linux下改变主机名,永久生效的方法

hostnamectl set-hostname test 例子 #支持大写必须就要这样写 hostnamectl set-hostname 名称 --static

Docker安装主从数据库

我自己的主数据库名字 user_muster 密码是123456 从数据库 就是slave2 名字是root 密码是123456 首先开启docker后直接执行命令 docker run -d \ -p 3307:3306 \ -v /xk857/mysql/master/conf:/etc/mysql/conf.d \ -v /xk857/mysql/master/data:/var/lib/mysql \ -e MYSQL_…

长非编码RNA(lncRNA)LINC00339编码的肽段促进滋养层细胞与子宫内膜细胞粘附的研究 AbMole

胚胎植入是一个复杂的过程&#xff0c;受多种因素影响&#xff0c;尤其是子宫内膜&#xff08;endometrium&#xff09;与胚泡&#xff08;blastocyst&#xff09;之间的相互作用。子宫内膜接受性&#xff08;Endometrial Receptivity, ER&#xff09;是指子宫内膜在适当的功能…

springboot+xjar加密打包部署教程

需求背景 为了跟上时代的步伐&#xff0c;为了更好的生存。开个玩笑&#xff0c;就是心血来潮&#xff0c;使用xjar加密部署jar包&#xff0c;于是就测试一下。 xjar教程 1-maven配置文件修改 首先找到自己ideal配置的maven文件夹&#xff0c;然后找到apache-maven-3.9.3\co…