vue可以通过安装插件vue-ls来存储数据到localStorage和sessionStorage,还可以控制存储的有效时间
1. 安装
npm install vue-ls -s
2. 引入
import Storage from 'vue-ls';
Vue.use(Storage, {
namespaced: '', // 存储的key的统一前缀
name: 'ls', // 可通过Vue.ls this.$ls访问
storage: 'local|session|memory', // 设置存储在localStorage还是sessionStorage
})
3. API
// 获取存储中的key的值
// default: 默认为null,如果key不存在,则返回default
Vue.ls.get(key, default);
// 设置一个key,并可以设置其有效时间
// expire: 默认为null, 单位为ms
Vue.ls.set(key, value, expire)
// 从存储中移除某一个key, 成功返回true,失败返回false
Vue.ls.remove(key)
// 清空存储中所有的key
Vue.ls.clear()
// 监听存储中某一个key的值是否变化
// callback接受三哥参数
// newValue: 存储中的新值
// oldValue:存储中的就只
// url:选项卡中的url
Vue.ls.on(name, callback)
// 删除key时触发
Vue.ls.off(name, callback)