JavaScript——session Storage获取存储的对象[object Object]
问题：使用session Storage存储的对象在获取时变成了[object Object]
解决办法：将对象使用 JSON.stringify() 转换为JSON字符串再进行存储
sessionStorage.setItem("initStudentChargeItemForm",JSON.stringify(this.form));
sessionStorage.setItem("initStudentChargeItemStatusStatusNumData",JSON.stringify(this.statusStatusNumData));
在获取存储的数据时使用 JSON.parse() 将获取到的数据再用JSON转换回来
JSON.parse(sessionStorage.getItem("initStudentChargeItemForm"));
JSON.parse(sessionStorage.getItem("initStudentChargeItemStatusStatusNumData"));
本地存储：window.sessionStorage的特性和使用方法
本地存储的特性：
-
数据存储在用户浏览器中
-
设置、读取方便、甚至页面刷新不会丢失数据
-
容量较大，sessionStorage约5M、localStorage约20M
-
只能存储字符串，可以将对象JSON.stringify()编码后再存储
-
window.sessionStorage的特性：
生命周期为关闭浏览器时失效在同一个窗口（页面）下数据可以分享以键值对的形式存储使用（比如 name=tom 键就是name，值就是tom）window.sessionStorage使用方法：
存储数据： sessionStorage.setItem(key,value);
获取数据： sessionStorage.getItem(key);
删除数据： sessionStorage.removeItem(key);
删除所有数据： sessionStorage.clear();
<input type="text">
<button class="set">存储数据</button>
<button class="get">获取数据</button>
<button class="remove">删除数据</button>
<button class="clear">清除所有数据</button>
<script>
var inp = document.querySelector("input");
var set = document.querySelector(".set");
var get = document.querySelector(".get");
var remove = document.querySelector(".remove");
// 点击存储数据按钮，将input的value值存储到浏览器中
set.addEventListener("click",function(){
var val = inp.value; // 将input的值保存起来
// 存储数据 sessionStorage.setItem(key,value);
// key是起的一个名字，要加双引号，value是要存储的值
sessionStorage.setItem("uname",val);
})
// 点击获取数据按钮，获取到uname值
get.addEventListener("click",function(){
var val = inp.value;
// 获取数据 sessionStorage.getItem(key);
console.log(sessionStorage.getItem("uname"));
})
// 点击删除数据按钮，删除uname值
remove.addEventListener("click",function(){
var val = inp.value;
// 删除数据 sessionStorage.removeItem(key);
sessionStorage.removeItem("uname");
})
// 点击删除所有数据按钮，会删除所有的数据，实际开发中要慎用
clear.addEventListener("click",function(){
var val = inp.value;
// 删除所有数据 sessionStorage.clear();
sessionStorage.clear();
})
</script>
