258资源分享网

您在看此文章之前有过其他程序的开发经验，那一定会知道一般例如安卓或者苹果的原生APP都提供了本地的存储功能，甚至可以使用sqlite数据库来做存储。可是微信的小程序框架基 ...

 

 

 

如果您在看此文章之前有过其他程序的开发经验，那一定会知道一般例如安卓或者苹果的原生APP都提供了本地的存储功能，甚至可以使用sqlite数据库来做存储。可是微信的小程序框架基于微信本身，其实际运行环境只是在浏览器里面，所以不会提供那么丰富的数据存储实力。但html5开始已经可以在浏览器里面存储数据，好在微信的小程序给这个功能封装好了，这样我们可以使用数据存储。

每个微信小程序都可以有自己的本地缓存，可以通过 wx.setStorage（wx.setStorageSync）、
wx.getStorage（wx.getStorageSync）、
wx.clearStorage（wx.clearStorageSync）
可以对本地缓存进行设置、获取和清理。本地缓存最大为10MB。

上面的set和get都有对应的Sync方法，带Sync的方法为同步方法、不带Sync的方法为异步方法。

设置缓存都需要设置一个key和对应的data值，我们在《微信web开发者工具》中的调试状态下可以点击调试窗口的Storage 栏来查看我们缓存在本地的数据。
缓存可以保存数组、数值、字符串、对象。

设置缓存

提供setStorage和setStorageSync两个接口,并且在使用设置存储方法时，如果小程序的存储值当中已经存在对应的key的值，那么会使用新的值替换原来的值。

setSotrage接口

1

2

3

4

5

6

7

8

9

 

wx.setStorage({

  key:"key",

  data:"value",

  success:function(res){console.log(res)},

  fail:function(res){console.log(res)},

  complete:function(res){console.log(res)},

})

//Object {errMsg: "setStorage:ok"}

//Object {errMsg: "setStorage:ok"}

 

setStorageSync接口

因为该方法为同步接口，所以直接设置key和data：

1

 

wx.setStorageSync('key','value')

 

上面两个demo中我们都使用了字符串缓存，当然我们也可以缓存一个对象，例如：

1

 

wx.setStorage({key:"ob",data:{name:'smallerpig',sex:1,age:18}})

 

获取缓存 getSotrage接口

异步接口，所以我们可以定义几个回调:

1

2

3

4

5

6

7

8

9

10

 

wx.getStorage(

{

    key:'key',

    success:function(res){

        console.log(res)//Object {errMsg: "getStorage:ok", data: "value1"}

    },