vue中localStorage和sessionStorage使用方法

localStorage和sessionStorage在vue中如何使用

使用 Web Storage 存储的优势

Web Storage键值对比存储 Cookie 方式更直观,而且容量更大,它包含两种:localStorage 和 sessionStorage

区别

sessionStorage(临时存储) :关闭浏览器数据删除
localStorage(长期存储) :数据一直存在,除非手动删除

使用方法

这里 localStorage和sessionStorage的使用方法是一致的

localStorage.setItem(‘name’, “胡八一”); # 设置键值对,存储数据
注意value支持json格式

localStorage.getItem(‘name’); # 获取存储的数据

localStorage.removeItem(‘name’); # 删除数据

监听数据变化
Storage 发生变化(增加、更新、删除)时的 触发,同一个页面发生的改变不会触发,只会监听同一域名下其他页面改变 Storage
window.addEventListener(‘storage’, function (e) {
  console.log(‘key’, e.key); console.log(‘oldValue’, e.oldValue);
  console.log(‘newValue’, e.newValue); console.log(‘url’, e.url);
})

小伟科技 wechat
python爱好者公众号—每日学习python必备
欢迎打赏支持!