localstorage、sessionstorage 存儲布爾值要注意


今天實現一個功能,點擊首頁,頭部按鈕,切換大屏功能。不同的屏,頁頭寬度不一樣,小屏1280px,  大屏百分百屏幕,左右留點120px的padding值。

思路:點擊按鈕,切換不同的子路由,頂部通過一個值,控制頭部樣式。刷新頁面,頭部要和路由相對應。關閉頁面。默認進首頁。這時,我想到用sessionStorage 。

  • 關閉瀏覽器sessionStorage 失效;
  • 頁面刷新不會消除數據;

但是,當 localstorage 或 sessionstorage 存儲布爾值數據時,取到的數據變成了字符串'true' 'false',

建議在存儲該類型數據時將 value 設置為 0、1,取值時用Number(localstorage.getItem('key')),再進行后續判斷操作。

相關代碼:

template結構:

vuex代碼:

 

data,computed定義獲取數值:

點按鈕,切換界面。

localstorage,sessionstorage 存取數據方式:

存儲字符、數字、布爾值等

存:localstorage.setItem('key', key-value); 取:localstorage.getItem('key');

存儲對象

存:localstorage.setItem("key", JSON.stringift(key-value)); 取:JSON.parse(localstorage.getItem('key'));

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM