小程序全局共享数据--存储

简介: 小程序全局共享数据--存储

1. 前言

全局共享数据 或者叫页面状态管理?


2. 全局共享数据

  1. 如果叫全局共享数据的话 其实用globalData或者 存储的话也还凑合

3. globalData

  1. 简单玩下吧
  2. 存储

// app.js
  // 全局的对象
{
  globalData: {
    userInfo: null,
    person:{
      name:"yzs",
     roomType:"别墅",
      students:[
        {id:123,age:30}
      ]
    }
  }
}
  1. 访问

const app = getApp()
//打印app 就知道

4. 微信存储

  1. 需要存储的内容。
  2. 只支持原生类型、Date、及能够通过JSON.stringify序列化的对象。
  3. storage 应只用来进行数据的持久化存储,不应用于运行时的数据传递或全局状态管理。
  4. 启动过程中过多的同步读写存储,会显著影响启动耗时。
  5. 将数据存储在本地缓存中指定的 key 中。会覆盖掉原来该 key 对应的内容。
  6. 除非用户主动删除或因存储空间原因被系统清理,否则数据都一直可用。
  7. 单个 key 允许存储的最大数据长度为 1MB,所有数据存储上限为 10MB

5. 同步

同步存储

wx.setStorage({
          key: "web111",
          data: {
              name: "web-yzs",
               roomType:"别墅",
              content: "同步存储",
              hobby: ["羽毛球", '爬山']
          }
      })

同步读取

wx.getStorage({
        key: "web111",
        success: res => {
            console.log("获取:", res);
            this.setData({
                result: res.data
            })
        }
    })

6. 异步

异步存储

try {
          wx.setStorageSync('sync', ['数组异步','sync代表异步'], )
      } catch (error) {
          console.log("存储失败:", error);
      }

异步读取

try {
      var value =  wx.getStorageSync('sync')
      console.log("异步读取:",value);
      this.setData({
        resultSync: value
    })
    } catch (error) {
        console.log("读取失败:", error);
    }

7. 后记

但是叫状态管理 有点不太合适,嘿嘿😋

用 mobx做状态管理 下篇文章见

补上mobox 文章链接


参考资料


初心

我所有的文章都只是基于入门,初步的了解;是自己的知识体系梳理;如有错误,欢迎交流;
如果能帮助到有缘人,非常的荣幸,一切为了部落的崛起;
共勉
相关文章
|
存储 安全 小程序
在微信小程序中使用 Vant 时如何确保数据的安全?
在微信小程序中使用 Vant 时如何确保数据的安全?
287 1
|
存储 移动开发 小程序
校园圈子系统小程序(圈子论坛、私信聊天、资料共享、二手交易、兼职,跑腿)开源码开发/微信公众号、小程序、H5多端账号同步/搭建多城市的综合社交生活平台
基于开源技术栈构建的校园圈子系统小程序,整合社交与生活服务功能,涵盖兴趣圈子、私信聊天、资料共享、二手交易、兼职跑腿等六大核心模块。通过多端账号同步(微信公众号/小程序/H5),实现数据实时交互,满足学生群体的多元化需求。项目精准锚定校园市场,以“社交+服务”双轮驱动,提供一站式解决方案,支持快速部署与多校区运营,同时具备广告、佣金、会员等多元变现能力,是打造校园生态的理想工具。
1458 3
校园圈子系统小程序(圈子论坛、私信聊天、资料共享、二手交易、兼职,跑腿)开源码开发/微信公众号、小程序、H5多端账号同步/搭建多城市的综合社交生活平台
|
小程序 JavaScript 开发工具
微信小程序——全局数据共享
【10月更文挑战第5天】
|
缓存 小程序 API
微信小程序页面导航与路由:实现多页面跳转与数据传递
本文深入探讨微信小程序的页面导航与路由机制,介绍多种页面跳转方式如`wx.navigateTo`、`wx.redirectTo`、`wx.switchTab`等,并讲解通过URL、全局变量和事件传递数据的方法。结合案例实现多页面跳转与数据传递,帮助开发者掌握这一重要技能。
|
缓存 小程序 API
微信小程序网络请求与API调用:实现数据交互
本文深入探讨了微信小程序的网络请求与API调用,涵盖`wx.request`的基本用法、常见场景(如获取数据、提交表单、上传和下载文件)及注意事项(如域名配置、HTTPS协议、超时设置和并发限制)。通过一个简单案例,演示了如何实现小程序与服务器的数据交互。掌握这些技能将帮助你构建功能更丰富的应用。
|
缓存 小程序 UED
如何利用小程序的生命周期函数实现数据的加载和更新?
如何利用小程序的生命周期函数实现数据的加载和更新?
445 4
|
移动开发 小程序 数据可视化
微信小程序可视化开发工具之动态数据
微信小程序可视化开发工具之动态数据
393 4
|
小程序 JavaScript 开发工具
微信小程序——全局数据共享
微信小程序——全局数据共享
|
小程序 开发者
微信小程序之网络数据请求 wx:request的简单使用
这篇文章介绍了微信小程序中如何使用wx.request进行网络数据请求,包括请求的配置、请求的格式以及如何在开发阶段关闭请求的合法检验。
微信小程序之网络数据请求 wx:request的简单使用
|
小程序 JavaScript 前端开发
微信小程序开发时数据是否是双向数据绑定的
微信小程序开发时数据是否是双向数据绑定的

热门文章

最新文章