对本地(localStorage)缓存 和 网页(sessionStorage)缓存的封装

对本地(localStorage)缓存 和 网页(sessionStorage)缓存的封装

• 在 src/utils/common.js 文件中复制下列代码

/**
 * 存储数据到本地存储
 */
export const setItem = (key, value) => {
  // 将数组、对象类型的数据转换为 JSON 格式字符串进行存储
  if (typeof value === 'object') {
    value = JSON.stringify(value)
  }
  window.localStorage.setItem(key, value)
}

/**
 * 从本地存储中获取数据
 */
export const getItem = key => {
  const data = window.localStorage.getItem(key)
  try {
    return JSON.parse(data)
  } catch (err) {
    return data
  }
}

/**
 * 删除本地存储数据
 */
export const removeItem = key => {
  if (!window.localStorage.getItem(key)) {
    return
  }
  window.localStorage.removeItem(key)
}

• 使用
  1. 导入 impiort {setItem, getItem, removeItem} from '@/src/utils/common.js
  2. 直接调用这几个方法就行, 传参与 window.localStorage 调用传参一样, 保存或设置时值不需要转化 JSON 格式, 获取的值是转化过的数据

sessionStorage 同上,只需将 localStorage 换成 sessionStorage即可