一、需求場景:一個文件資源器的功能:
1、前端頁面選擇特定路徑中的數據(使用Ztree)
2 、由服務器對該數據進行解析,按照自定義的模型將其包裝成一個Json返回給前端(Java類),
3、前端拿到數據進行頁面展示(使用bootgrid)
4 、數據添加完成以后將其導入到數據庫中(Java類)
以上過程省略括號中詳細代碼,本文重點敘述2 3 4中數據在前端的暫存,因為用戶可能不是一次性選擇完所有要導入的數據,所以要先把選擇的數據暫時保存的前端頁面中,這時候可以使用sessionStorage,一個比cookie更好的本地存儲方式.
特點是存取方便,並且只存在當前會話期間,存儲在 sessionStorage 里面的數據在頁面會話結束時會被清除。頁面會話在瀏覽器打開期間一直保持,並且重新加載或恢復頁面仍會保持原來的頁面會話。在新標簽或窗口打開一個頁面會初始化一個新的會話,這點和 session cookies 的運行方式不同
使用方法:
// 保存數據到sessionStorage sessionStorage.setItem('key', 'value'); // 從sessionStorage獲取數據 var data = sessionStorage.getItem('key'); // 從sessionStorage刪除保存的數據 sessionStorage.removeItem('key'); // 從sessionStorage刪除所有保存的數據 sessionStorage.clear();
在使用setItem時注意,要添加進sessionStorage中的數據的key不要與當前sessionStorage中已保存的數據中的Key值相同,否則會將之前具有相同key值的數據給覆蓋掉。