Vue中使用本地存儲

1.保存， localStorage的S一定要大寫

//對象

const info = { name: 'hou', age: 24, id: '001' };

//字符串

const str="haha";

localStorage.setItem('hou', JSON.stringify(info));

localStorage.setItem('zheng', str);

2.獲取

var data1 = JSON.parse(localStorage.getItem('hou'));

var data2 = localStorage.getItem('zheng');

3.刪除

//刪除某個
localStorage.removeItem('hou');

//刪除所有
localStorage.clear();

3. 注意

localStorage有效期是永久的。一般的瀏覽器能存儲的是5MB左右。
sessionStorage api與localStorage相同。
sessionStorage默認的有效期是瀏覽器的會話時間（也就是說標簽頁關閉后就消失了）。
localStorage作用域是協議、主機名、端口。（理論上，不人為的刪除，一直存在設備中）
sessionStorage作用域是窗口、協議、主機名、端口。
知道了這些知識點后，你的問題就很好解決了。
localStorage是window上的。所以不需要寫this.localStorage，vue中如果寫this，是指vue實例。會報錯

4 把localStorage掛載到Vue實例中使用

Vue.prototype.setLocalValue = function(name, value) {
    if (window.localStorage) {
        localStorage.setItem(name, value);
    } else {
        alert('This browser does NOT support localStorage');
    }
};
Vue.prototype.getLocalValue = function (name) {
    const value = localStorage.getItem(name);
    if (value) {
        return value;
    } else {
        return '';
    }
};