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

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

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 文章链接


参考资料


初心

我所有的文章都只是基于入门,初步的了解;是自己的知识体系梳理;如有错误,欢迎交流;
如果能帮助到有缘人,非常的荣幸,一切为了部落的崛起;
共勉
相关文章
|
6天前
|
存储 安全 小程序
在微信小程序中使用 Vant 时如何确保数据的安全?
在微信小程序中使用 Vant 时如何确保数据的安全?
20 1
|
3月前
|
小程序 API 数据库
【微信小程序-原生开发】实用教程09 - 可滚动选项,动态列表-步骤条(含事件传参),动态详情(含微信云查询单条数据 doc)
【微信小程序-原生开发】实用教程09 - 可滚动选项,动态列表-步骤条(含事件传参),动态详情(含微信云查询单条数据 doc)
66 0
|
2月前
|
缓存 小程序 数据库
小程序页面之间(传值)传递数据的方法
小程序页面之间(传值)传递数据的方法
|
9天前
|
小程序 开发者
微信小程序之网络数据请求 wx:request的简单使用
这篇文章介绍了微信小程序中如何使用wx.request进行网络数据请求,包括请求的配置、请求的格式以及如何在开发阶段关闭请求的合法检验。
微信小程序之网络数据请求 wx:request的简单使用
|
19天前
|
小程序 JavaScript 开发工具
微信小程序——全局数据共享
微信小程序——全局数据共享
|
2月前
|
小程序 JavaScript 前端开发
微信小程序开发时数据是否是双向数据绑定的
微信小程序开发时数据是否是双向数据绑定的
|
2月前
|
小程序 JavaScript Java
微信小程序+SpringBoot接入后台服务,接口数据来自后端
这篇文章介绍了如何将微信小程序与SpringBoot后端服务进行数据交互,包括后端接口的编写、小程序获取接口数据的方法,以及数据在小程序中的展示。同时,还涉及到了使用Vue搭建后台管理系统,方便数据的查看和管理。
微信小程序+SpringBoot接入后台服务,接口数据来自后端
|
3月前
|
小程序 前端开发
【微信小程序-原生开发】实用教程22 - 绘制图表(引入 echarts,含图表的懒加载-获取到数据后再渲染图表,多图表加载等技巧)
【微信小程序-原生开发】实用教程22 - 绘制图表(引入 echarts,含图表的懒加载-获取到数据后再渲染图表,多图表加载等技巧)
132 0
|
3月前
|
JSON 小程序 数据库
【微信小程序-原生开发】实用教程14 - 列表的分页加载,触底加载更多(含无更多数据的提醒和显示,自定义组件)
【微信小程序-原生开发】实用教程14 - 列表的分页加载,触底加载更多(含无更多数据的提醒和显示,自定义组件)
94 0
|
3月前
|
存储 小程序 数据库
【微信小程序-原生开发】实用教程08 - 开通微信云开发,操作云数据库新增数据(含修改数据权限),初始化云服务(含获取微信云环境 id),获取云数据,滚动公告栏
【微信小程序-原生开发】实用教程08 - 开通微信云开发,操作云数据库新增数据(含修改数据权限),初始化云服务(含获取微信云环境 id),获取云数据,滚动公告栏
53 0
下一篇
无影云桌面