vue 存储

vue 存储 web storage

vue使用web存储通用方法

一、新建common/storage.js

// 存储localStorage
export const setStore = (key, value) => {
  if (!key) {
    return
  }
  if (typeof value !== 'string') {
    value = JSON.stringify(value)
  }
  window.localStorage.setItem(key, value)
}
// 获取localStorage
export const getStore = key => {
  if (!key) return
  return window.localStorage.getItem(key)
}
// 删除localStorage
export const removeStore = key => {
  if (!key) return
  window.localStorage.removeItem(key)
}
// 全部清除
export const clearStore = () => {
  window.localStorage.clear()
}

二、在vue中使用

<template>
  <div class="home">
    <div class="boxs"></div>
  </div>
</template>

<script>
  import {getStore, setStore, removeStore, clearStore} from '@/common/storage'
  export default {
    data () {
      return {
        type: 'index'
      }
    },
    created () {
      // 存储
      setStore('data', 'hello')
      // 获取存储
      let getStores = getStore('data')
      // 清除
      removeStore('data')
      // 全部清除
      clearStore()
    }
  }
</script>

<style>
</style>

推荐一个很好的项目(https://github.com/bailicangdu/vue2-elm)

如有错误地方，请留言指教，谢谢大家