Vue将数据存放在会话存储中

开心点啦.2024-01-08 6:09

前言：

会话存储（session Storage）：当浏览器被关闭的时候，存在session中的数据就会消失。

本地存储（local Storage）：在本地存储的数据会永远保留，除非你自己删除，要不然一直在。

1、设置

复制代码

// 数据监听属性
watch: {
// 将添加的数据存放到session中
    tableList() {
        sessionStorage.setItem('tableList', JSON.stringify(this.tableList))
    }
},

2、获取

复制代码

<script>
    new Vue({
        el:'#app',
        data:{
           // 再从浏览器中获取刚在存储的数据，如果没有数据就空数组占用
           tableList:JSON.parse(sessionStorage.getItem('tableList') || '[]'),
        }
    })
</script>