目录
1. 同步API
1.1 getStorageSync存储API
1.2 removeStorageSync获取数据API
1.3 removeStorageSync删除
1.4 clearStorageSync清空
2. 异步API
2.1 setStorage存储API
2.2 getStorage获取数据API
2.3 removeStorage删除API
2.4 clearStorage清空
3. 同步和异步的区别
1. 同步API
小程序本地存储是指在小程序中使用API将数据存储在用户的设备上，以便小程序运行时和下次启动时快速地读取这些数据。
注意事项：对象类型的数据，可以直接进行存储获取，无需使用 JSON.stringify()、JSON.parse(）转换。
找到cate.wxml文件，注释或者删除之前内容，创建四个按钮：
<button size="mini" type="primary">存储</button>
<button size="mini" type="default">获取</button>
<button size="mini" type="primary">删除</button>
<button size="mini" type="warn">清空</button>
此时按钮之间过于拥挤，我们可以找到cate.scss文件，给按键之间添加空隙：
button{margin: 34rpx;
}
再次返回cate.wxml文件，给四个按钮添加事件：
<button size="mini" type="primary" bind:tap="setStorage">存储</button>
<button size="mini" type="default" bind:tap="getStorage">获取</button>
<button size="mini" type="primary" bind:tap="removeStorage">删除</button>
<button size="mini" type="warn" bind:tap="clearStorage">清空</button>
找到cate.js文件，编写一个事件框架：
Page({// 将数据存储到本地setStorage(){},// 获取本地存储的数据getStorage(){},// 删除本地存储的数据removeStorage(){},// 清空本地存储的全部数据clearStorage(){}
})1.1 getStorageSync存储API
将以上代码setStorage()内容给改为：
// 将数据存储到本地setStorage(){// 第一个参数：本地存储中指定的key// 第二个参数：需要存储的数据wx.setStorageSync('num',1)// 在小程序中如果存储的是对象类型的数据，可以直接进行存储获取，无需使用 JSON.stringify()、JSON.parse(）转换wx.setStorageSync('obj', { name:'tom', age: 10 })},
点击存储，会发现数据正常存储：
1.2 removeStorageSync获取数据API
将getStorage()代码更改为：
// 获取本地存储的数据getStorage(){// 从本地存储的数据中获取指定 key 的数据、内容// wx.getStorageSync('num')// wx.getStorageSync('obj')// 创建变量用于接收数据const num = wx.getStorageSync('num')const obj = wx.getStorageSync('obj')// 打印数据console.log(num)console.log(obj)},
点击“获取”，可以看到在consle中打印出了获取到的数据：
注意：在这里我们会发现我们没有点存储，但是也能获取到数据，那是因为编译器本身存储的之前的数据，我们可以清空之前的数据，这样就可以了：
1.3 removeStorageSync删除
将removeStorage()的函数更改为：
// 删除本地存储的数据removeStorage(){// 从本地移除指定key的数据内容wx.removeStorageSync('num')},
点击删除：
1.4 clearStorageSync清空
将clearStorage()更改为：
// 清空本地存储的全部数据clearStorage(){wx.clearStorageSync()}
点击清空，数据全部清空：
同步API完整Page代码：
Page({// 将数据存储到本地setStorage(){// 第一个参数：本地存储中指定的key// 第二个参数：需要存储的数据wx.setStorageSync('num',1)// 在小程序中如果存储的是对象类型的数据，可以直接进行存储获取，无需使用 JSON.stringify()、JSON.parse(）转换wx.setStorageSync('obj', { name:'tom', age: 10 })},// 获取本地存储的数据getStorage(){// 从本地存储的数据中获取指定 key 的数据、内容// wx.getStorageSync('num')// wx.getStorageSync('obj')// 创建变量用于接收数据const num = wx.getStorageSync('num')const obj = wx.getStorageSync('obj')// 打印数据console.log(num)console.log(obj)},// 删除本地存储的数据removeStorage(){// 从本地移除指定key的数据内容wx.removeStorageSync('num')},// 清空本地存储的全部数据clearStorage(){wx.clearStorageSync()}
})2. 异步API
2.1 setStorage存储API
将setStorage()中的代码改为：
// 将数据存储到本地setStorage(){wx.setStorage({key: 'num',data:1})wx.setStorage({key: 'obj',data: { name: 'jerry',age: 18}})},
点击存储：
2.2 getStorage获取数据API
将getStorage()更改为：
// 获取本地存储的数据async getStorage(){const obj = await wx.getStorage({key:'obj'})console.log(obj)},
点击获取：
我们可以看到此时数据在data内，则可以更改代码：
// 获取本地存储的数据async getStorage(){const { data } = await wx.getStorage({key:'obj'})console.log(data)},点击获取：
2.3 removeStorage删除API
将removeStorage()更改为：
// 删除本地存储的数据removeStorage(){wx.removeStorage({key:'num'})},
点击删除：
2.4 clearStorage清空
将clearStorage()更改为：
// 清空本地存储的全部数据clearStorage(){wx.clearStorage()}
点击清空：
3. 同步和异步的区别
小程序本地存储 API 提供了同步和异步两种方式进行数据的读写操作。它们的主要区别在于执行操作时是否会阻塞主线程。
同步方式：在使用同步方式进行本地存储操作时，代码会阻塞主线程的执行，直到本地存储操作完成后才会继续执行后续代码。这意味着如果存储操作需要较长时间，会导致界面出现卡顿现象，影响用户体验。
异步方式：在使用异步方式进行本地存储操作时，代码会立即返回，不会阻塞主线程的执行，而是通过回调函数或 Promise 来处理存储操作的结果。这样可以避免阻塞主线程，提高程序的流畅性和响应速度。
微信小程序开发_时光の尘的博客-CSDN博客
