h5中新增的离线存储(webStorage)
- 本地存储 localStorage
- 会话存储 sessionStorage
localStorage 和sessionStorage 的联系:
大小都是5M左右 存储形式:都必须以字符串形式存储,语法相同
localStorage 和sessionStorage 的区别:
localStorage关闭浏览器还存在;sessionStorage关闭浏览器即消失
setItem(‘a’,‘b’) getItem(‘a’,‘b’)
localStorage 和sessionStorage 以及cookie的区别:
本地模拟增删查
<script>
new Vue({
el: '#app',
data: {
userInfo: {
name: '',
age: '',
phone: '',
message: '',
},
infoList: localStorage.getItem('arr') ? JSON.parse(localStorage.getItem('arr')) : []
},
methods: {
add() {
this.infoList.push(this.userInfo);
this.reset();
//更新后的数组存储到本地存储中,必须以字符串形式存储
//对对象进行字符串转化
localStorage.setItem('arr', JSON.stringify(this.infoList))
},
reset() {
this.userInfo = {
name: '',
age: '',
phone: '',
message: '',
}
},
del(i) {
this.infoList.splice(i, 1);
localStorage.setItem('arr', JSON.stringify(this.infoList))
}
},
})
</script>