小程序数据缓存

本文档详细介绍了微信小程序中关于数据缓存的操作方法,包括wx.setStorage与wx.setStorageSync的存储功能,wx.getStorage与wx.getStorageSync的读取功能,wx.getStorageInfo与wx.getStorageInfoSync获取缓存信息,以及wx.removeStorage、wx.removeStorageSync的清除功能和wx.clearStorage、wx.clearStorageSync的清空缓存方法。这些API帮助开发者高效管理小程序的本地数据。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

目录

1 wx.setStorage(Object object)

2 wx.setStorageSync(string key, any data)

3 wx.getStorage(Object object)

4 wx.getStorageSync(string key)

5 wx.getStorageInfo(Object object)

6 wx.getStorageInfoSync()

7 wx.removeStorage(Object object)

8 wx.removeStorageSync(string key)

9 wx.clearStorage(Object object)

10 wx.clearStorageSync()


1 wx.setStorage(Object object)

异步将数据存储在本地缓存中指定的 key 中,如果key相同则会覆盖掉原来该 key 对应的内容。数据存储生命周期跟小程序本身一致,即除用户主动删除或超过一定时间被自动清理。

注:单个 key 允许存储的最大数据长度为 1MB,所有数据存储上限为 10MB。

Object object

属性类型默认值必填说明
keystring 本地缓存中指定的 key
dataany 需要存储的内容。只支持原生类型、Date、及能够通过JSON.stringify序列化的对象。
successfunction 接口调用成功的回调函数
failfunction 接口调用失败的回调函数
completefunction 接口调用结束的回调函数(调用成功、失败都会执行)

使用案例

  wx.setStorage({
      key: 'name',
      data: 'Trevor'
    })

 

2 wx.setStorageSync(string key, any data)

与wx.setStorage作用相同,只不过wx.setStorageSync是同步

string key

本地缓存中指定的 key

any data

需要存储的内容。只支持原生类型、Date、及能够通过JSON.stringify序列化的对象。

使用案例

wx.setStorageSync('name', 'Smith')

 

3 wx.getStorage(Object object)

从本地缓存中异步获取指定 key 的内容

Object object

属性类型默认值必填说明
keystring 本地缓存中指定的 key
successfunction 接口调用成功的回调函数
failfunction 接口调用失败的回调函数
completefunction 接口调用结束的回调函数(调用成功、失败都会执行)

object.success 回调函数

Object res

属性类型说明
dataanykey对应的内容

使用案例

 wx.getStorage({
      key: 'name',
      success(res) {
        console.log(res.data)
      }
    })

 

4 wx.getStorageSync(string key)

与wx.getStorage作用相同,不过此函数为同步获取

string key

本地缓存中指定的 key

返回值

any data

key对应的内容

使用案例

 try {
      const value = wx.getStorageSync('name2')
      if (value) {
        console.log(value)
      }
    } catch (e) {
      // 不能正常获取时的逻辑
    }

 

5 wx.getStorageInfo(Object object)

异步获取当前storage的相关信息

Object object

属性类型默认值必填说明
successfunction 接口调用成功的回调函数
failfunction 接口调用失败的回调函数
completefunction 接口调用结束的回调函数(调用成功、失败都会执行)

object.success 回调函数

Object object

属性类型说明
keysArray.<string>当前 storage 中所有的 key
currentSizenumber当前占用的空间大小, 单位 KB
limitSizenumber限制的空间大小,单位 KB

使用案例

wx.getStorageInfo({
  success(res) {
    console.log(res.keys)
    console.log(res.currentSize)
    console.log(res.limitSize)
  }
})

 

6 Object wx.getStorageInfoSync()

与wx.getStorageInfo作用相同,此为同步版本

Object object

属性类型说明
keysArray.<string>当前 storage 中所有的 key
currentSizenumber当前占用的空间大小, 单位 KB
limitSizenumber限制的空间大小,单位 KB

使用案例

try {
  const res = wx.getStorageInfoSync()
  console.log(res.keys)
  console.log(res.currentSize)
  console.log(res.limitSize)
} catch (e) {
  // 不能正常获取时的逻辑
}

 

7 wx.removeStorage(Object object)

异步从本地缓存中移除指定 key

Object object

属性类型默认值必填说明
keystring 本地缓存中指定的 key
successfunction 接口调用成功的回调函数
failfunction 接口调用失败的回调函数
completefunction 接口调用结束的回调函数(调用成功、失败都会执行)

使用案例

wx.removeStorage({
  key: 'name',
  success(res) {
    console.log(res.data)
  }
})

 

8 wx.removeStorageSync(string key)

wx.removeStorage的同步版本

string key

本地缓存中指定的 key

使用案例

try {
  wx.removeStorageSync('name')
} catch (e) {
  // 不能正常删除时的业务逻辑
}

 

9 wx.clearStorage(Object object)

异步清理本地数据缓存

Object object

属性类型默认值必填说明
successfunction 接口调用成功的回调函数
failfunction 接口调用失败的回调函数
completefunction 接口调用结束的回调函数(调用成功、失败都会执行)

使用案例

wx.clearStorage()

 

10 wx.clearStorageSync()

wx.clearStorage的同步版本

使用案例

try {
  wx.clearStorageSync()
} catch (e) {
  // 不能正常删除时的业务逻辑
}

 

<think>嗯,用户想了解微信小程序数据缓存的方法或实现方式,还提到了需要教程。首先,我需要回忆一下微信小程序的官方文档,特别是关于数据存储的部分。微信小程序提供了wx.setStorage这样的API,应该分为同步和异步两种方法吧。 用户可能需要知道基本的存储、读取和删除操作。比如,wx.setStorage是异步的,而wx.setStorageSync是同步的。需要举例说明这两种方法的使用场景和区别,比如同步方法适合数据量小的情况,避免阻塞主线程。 然后,数据缓存的应用场景也很重要。比如用户登录状态、临时表单数据或者页面间参数传递。比如用户填写表单到一半,退出后回来还能继续,这时候可以用缓存。 接着,注意事项部分,比如存储大小限制,单个key允许的最大数据量是1MB,总缓存不超过10MB。还有数据类型支持,只能是原生类型或可JSON序列化的对象。另外,清理策略,用户长时间不用小程序的话,缓存可能被系统清除,所以关键数据应该存在服务器。 可能还需要提到相关的API,比如获取缓存信息wx.getStorageInfo,清除所有缓存wx.clearStorage,以及监听缓存变化,不过小程序好像没有内置的监听器,可能需要通过其他方式实现。 然后,用户可能想知道实际代码示例,比如如何保存用户信息,读取,删除某个key,或者清空所有缓存。代码示例应该简洁明了,使用异步和同步两种方式。 最后,生成相关问题的时候,要考虑用户可能进一步的问题,比如数据加密、性能优化、缓存限制和与服务器同步的问题。这样能帮助用户更全面地了解数据缓存的应用和潜在问题。 需要确保回答结构清晰,分点说明,代码示例正确,并且引用用户提供的参考中的例子,比如引用中的SkinStyle,可能在设置皮肤样式的时候用到了缓存,所以可以结合这个例子说明。比如在切换主题时,将用户选择的主题样式缓存起来,下次打开时读取。 还要注意不要使用Markdown格式,但用户给的系统指令里要求代码块用```python这样的,不过在这里用户的问题是关于微信小程序的,应该用JavaScript的代码示例。同时确保LaTeX格式正确,但问题中没有涉及到数学公式,所以可能不需要使用。 总结一下,回答的结构应该是:数据缓存的实现方法,分为异步和同步API,应用场景,注意事项,代码示例,相关问题。每个部分用简洁的中文解释,代码示例正确,并自然地引用提供的参考内容。</think>### 微信小程序数据缓存实现方法 微信小程序通过全局API `wx.setStorage` 和 `wx.getStorage` 实现数据缓存功能,支持同步和异步两种操作模式[^1]。 #### 一、核心API及使用 1. **异步存储与读取** ```javascript // 存储数据 wx.setStorage({ key: 'userInfo', data: { name: '张三', age: 25 }, success: () => console.log('存储成功') }); // 读取数据 wx.getStorage({ key: 'userInfo', success: res => console.log(res.data) }); ``` 2. **同步存储与读取** ```javascript try { wx.setStorageSync('theme', 'dark'); // 存储主题模式[^2] const theme = wx.getStorageSync('theme'); } catch (e) { console.error('操作失败'); } ``` #### 二、应用场景 1. **用户偏好设置** 如主题样式(引用示例中的`SkinStyle`)、语言设置等 2. **表单草稿保存** 3. **页面间参数传递** 4. **高频访问数据缓存** #### 三、注意事项 1. **存储限制** - 单个key最大支持1MB - 总缓存不超过10MB 2. **数据类型** 支持原生类型及可JSON序列化的对象 3. **数据安全** 敏感数据建议加密存储 #### 四、扩展操作 ```javascript // 删除指定缓存 wx.removeStorage({ key: 'tempData' }); // 清空所有缓存 wx.clearStorage(); // 获取缓存信息 wx.getStorageInfo({ success: res => console.log(res.keys) // 输出所有存储key }); ```
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值