## 一、概述 ?一個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) //不偵查 ```