uniapp-vue3，封装类似于storage及cookie的存储方法

cache.js

/**
 * 存储数据
 * key: 缓存的键名，必填
 * value: 缓存的值，选填
 * 
 * when: 缓存的过期时间，选填:
 *    【1】传入具体秒数时（单位必须为秒），到期后清除；
 *    【2】传入单词 forever时，永不清除；
 *    【3】传入单词 once时，获取一次后清除 以及 App关闭时清除；
 *    【4】传其他值或不传值时，App关闭时清除；
 */
function set(key, value, when) {
  if (!key) { // 如果key为空，直接返回
    console.log("key不能空");
    return;
  }

  const valueObj = {
    value: value,
    storageExpire: '',
  }
  if (when == 'forever') { //永久存储
    valueObj.storageExpire = 'forever';
  } else if (!isNaN(Number.parseFloat(when))) { //规定时间后过期
    const timestamp = Date.parse(new Date()) / 1000; // 获取当前时间戳，单位为秒
    valueObj.storageExpire = timestamp + Number.parseFloat(when)
  } else if (when == 'once') { //一次性数据-获取一次后过期
    valueObj.storageExpire = 'once'
  } else { //临时存储-App关闭后过期
    valueObj.storageExpire = 'temporary'
  }

  uni.setStorageSync(key, valueObj);
}

/**
 * 获取数据
 * key: 缓存的键名，必填
 */
function get(key) {
  if (!key) { // 如果key为空，直接返回
    console.log("key不能空");
    return;
  }

  const res = uni.getStorageSync(key) || '';
  const when = res?.storageExpire || '';
  let final = ''
  if (when == 'forever') { //永久存储
    final = res?.value || ''
  } else if (!isNaN(Number.parseFloat(when))) { //规定时间后过期
    const timestamp = Date.parse(new Date()) / 1000; // 获取当前时间戳，单位为秒
    if (timestamp >= Number.parseFloat(when)) { //已过期
      remove(key);
      final = ''
    } else { //未过期
      final = res?.value || ''
    }
  } else if (when == 'temporary') { //临时存储
    final = res?.value || ''
  } else if (when == 'once') { //一次性数据，在获取一次后过期
    final = res?.value || ''
    remove(key)
  } else { //其他情况（例如获取通过uni.seStorageSync存储的值）
    final = res || ''
  }

  return final
}

/**
 * 移除数据
 * key: 缓存的键名，必填
 */
function remove(key) {
  if (!key) { // 如果key为空，直接返回
    console.log("key不能空");
    return;
  }

  uni.removeStorageSync(key);
}

/**
 * 移除所有临时数据（此方法需要在App.vue里调用）
 */
function removeAllTempData() {
  const list = uni.getStorageInfoSync().keys || []
  for (let item of list) {
    let res = uni.getStorageSync(item) || ''
    if (res?.storageExpire == 'temporary' || res?.storageExpire == 'once') { //判断是否为临时数据或一次性数据
      remove(item)
    }
  }
}


export default {
  set,
  get,
  remove,
  removeAllTempData,
}

App.vue

import handleCache from "@/utils/cache/cache.js" //引入存储方法

onLaunch() {
  handleCache.removeAllTempData() // 移除所有临时数据
}

如何调用

<script>
  import handleCache from "@/utils/cache/cache.js" //先引入方法
  //【注意】虽然基于uni.setStorageSync等方法改写，但是由于数据结构不同，原生存储API与handleCache方法最好不要混用

  // 规定时间后过期
  handleCache.set('a', { s1: { b1: 6, b2: 8 }, s2: 9 }, 10) //可直接存储对象等，无需转格式
  handleCache.set('a', '时效', 10) //10秒后过期 
  handleCache.set('a', '时效', 3600 * 24 * 7) //7天后过期

  // 永久存储
  handleCache.set('b', '永久', 'forever')

  // 一次性存储
  handleCache.set('eee', '一次性', 'once')
  handleCache.get('eee') //第一次获取得到值 eee
  handleCache.get('eee') //后续获取得到 空

  // 临时存储-App关闭时清除
  handleCache.set('c', '临时') //可以不传值
  handleCache.set('c', '临时', 'abcde') //可以是NaN（Not a Number非数）的任意值

  handleCache.get('a') //获取某个数据数据
  handleCache.remove('a') //移除某个数据

  // 在App.vue里的
  //   import handleCache from "@/utils/cache/cache.js"
  //   export default {
  //     onLaunch() {
  //       handleCache.removeAllTempData() //移除所有临时数据
  //     },
  //   }
</script>