数据缓存

uni.setStorage
官方文档：https://uniapp.dcloud.io/api/storage/storage?id=setstorage
将数据存储在本地缓存中指定的key中，会覆盖掉原来该key对应的内容，这是一个异步接口。
代码演示：

  1. <template>
  2.     <view>
  3.         <button @click="getApi">发送get请求</button>
  4.         <button type="primary" @click='setStorge'>存储数据</button>
  5.         <button type="default" @click='getStorge'>获取数据</button>
  6.         <button type="default" @click='removeId'>移除数据</button>
  7.         <view>
  8.             这是列表页面    
  9.         </view>
  10.         <view v-for="(item,index) in list" :key='index'>{{item}}<br></view>
  11.         <button type="default" @click="pullDown">下拉刷新</button>
  12.     </view>
  13. </template>
  15. <script>
  16.     export default {
  17.         data() {
  18.             return {
  19.                 list:['前端','JAVA','UI','测试','大数据']
  20.             }
  21.         },
  22.         onPullDownRefresh() {
  23.             console.log('触发了下拉刷新')
  24.             setTimeout(()=>{
  25.                 this.list = ['JAVA','UI','测试','大数据','前端'] //下拉刷新更新了数据，但是还在不停刷新
  26.                 uni.stopPullDownRefresh()
  27.             },2000)  //加了一个延时2秒        
  28.         },
  29.         onReachBottom(){
  30.             console.log('页面触底了')
  31.             this.list = [...this.list,...['JAVA1','UI1','测试1','大数据1','前端1']]
  32.         },
  33.         methods: {
  34.             pullDown(){
  35.                 //点击按钮触发下拉刷新
  36.                 uni.startPullDownRefresh()
  37.             },
  38.             getApi(){
  39.                 uni.request({
  40.                     url:'http://localhost:8082/api/getlunbo',
  41.                     success(res){
  42.                         console.log(res.data.message)
  44.                     }
  45.                 })
  46.             },
  48.             //存储数据
  49.             setStorge(){
  50.                 // uni.setStorage({
  51.                 //     key:'id',
  52.                 //     data:80,
  53.                 //     success(){
  54.                 //         console.log('存储成功')
  55.                 //     }
  56.                 // })
  58.                 //第二种方法
  59.                 uni.setStorageSync('id',110)
  60.             },
  62.             //获取数据
  63.             getStorge(){
  64.                 // uni.getStorage({
  65.                 //     key:'id',
  66.                 //     success(res){
  67.                 //         console.log("获取成功",res.data)
  68.                 //     }
  69.                 // })
  71.                 //第二种方法
  72.                 const  res = uni.getStorageSync('id')
  73.                 console.log(res)
  74.             },
  76.             //移除数据
  77.             removeId(){
  78.                 // uni.removeStorage({
  79.                 //     key:'id',
  80.                 //     success(){
  81.                 //         console.log('移除成功')
  82.                 //     }
  83.                 // })
  85.                 //第二种方法
  86.                 uni.removeStorageSync('id')
  87.             }
  88.         }
  89.     }
  90. </script>
  92. <style>
  94. </style>

image.png

这里主要讲了 存储数据 获取数据 以及移除数据 三种方式

具体的可以看上面的代码