## 一、概述  一个vue封装的本地储存的方法； ## 二、安装 ``` npm install vue-ls --save ``` ## 三、定义 定义： ``` import Vue from 'vue' import VueStorage from 'vue-ls' storageOptions: { namespace: 'pro__', // key prefix name: 'ls', // name variable Vue.[ls] or this.[$ls], storage: 'local' // storage name session, local, memory }； Vue.use(VueStorage, storageOptions) ``` ## 四、使用 ``` //全局引用 Vue.ls //上下文使用 this.$ls ``` ## 五、API ```jsx //存储 Vue.ls.set(name, value, expire) 将value设置到name中，且将value转换为json格式； expire：默认为null //读取 Vue.ls.get(name, def) 返回storage中 name值。在返回之前，内部解析JSON中的值 def: 默认null, 如果name没设置，则返回 def的值； //删除 Vue.ls.remove(name) 删除name的值，如果成功则返回true，否则返回false //清空 Vue.ls.clear() 清空存储 ``` 值发生变化的时候触发事件： ``` let callback = (newValue, oldValue, url) => { console.log('localStorage change', newValue); } Vue.ls.on('foo', callback) //侦查改变foo键并触发回调 Vue.ls.off('foo', callback) //不侦查 ```