cookie: cookie生命期为只在设置的cookie过期时间之前一直有效，即使窗口或浏览器关闭。 存放数据大小为4K左右, 有个数限制（各浏览器不同），一般不能超过20个。缺点是不能储存大数据且不易读取
localStorage:生命周期是永久的，关闭页面或浏览器之后 localStorage 中的数据也不会消失。localStorage 除非主动删除数据，否则数据永远不会消失
sessionStorage: 生命周期是仅在当前会话下有效。sessionStorage 引入了一个“浏览器窗口”的概念，sessionStorage 是在同源的窗口中始终存在的数据。只要这个浏览器窗口没有关闭，即使刷新页面或者进入同源另一个页面，数据依然存在。但是 sessionStorage 在关闭了浏览器窗口后就会被销毁。同时独立的打开同一个窗口同一个页面，sessionStorage 也是不一样的.
保留sessionStorage的操作
1.刷新当前页面，
2.(同域) location.href、window.open、或者通过带target="_blank"的a标签打开新标签，之前的sessionStorage还在,注意新打开的标签中的sessionStorage和原页面中的sessionStorage, 不再相互影响,相互独立的
丢失sessionStorage的操作:
主动打开一个新窗口或者新标签
localStorage
localStorage localStorage
sessionStorage
sessionStorage sessionStorage
Vue本地存储数据
关键代码
data() {
return {
//由于todos是MyHeader组件和MyFooter组件都在使用，所以放在App中（状态提升）
todos:JSON.parse(localStorage.getItem('todos')) || []
}
},
watch: {
todos:{
deep:true,
handler(value){
localStorage.setItem('todos',JSON.stringify(value))
}
}
},
暑期编程PK赛
得CSDN机械键盘等精美礼品！
