如何使用JavaScript检索localStorage数据

Question

我试图检索所有设置的localStorage.setItem（），但目前不成功。

这是我的代码

var base_url = window.location.origin;
$.ajax({
    type: 'POST',
    url: base_url + '/demo/now',
    dataType: 'json',
    success: function(data) {

        localStorage.setItem('visitor_info', JSON.stringify(data.visitor_info));
        localStorage.setItem('visitor_country', data.visitor_country);
        localStorage.setItem('phone2', data.phone2);
        localStorage.setItem('countryUrl', data.countryUrl);
    }
});

现在，我已经成功地将其保存到localStorage，但是我不知道如何检索所有这些信息。

这是我检索它的代码。

function localStorageGetItem() {
    localStorage.getItem('visitor_country');
    localStorage.getItem('phone2');
    localStorage.getItem('countryUrl');

    return "blank so far"
}

我知道我需要将价值作为回报，但是我不确定如何返回所有这3个getItem。

这是我需要调用localStorageGetItem（）的地方

$(document).ready(function() {
    localStorageGetItem();
}

谢谢。

Answer 1

如果我正确地阅读了此内容，听起来您只是想返回一个对象，该对象的属性与localStorage存储的某些键匹配。

function localStorageGetItem() {
  return {
    visitor_country: localStorage.getItem('visitor_country'),
    phone2: localStorage.getItem('phone2'),
    countryUrl: localStorage.getItem('countryUrl')
  }
}

然后，您可以像这样使用它...

var localData = localStorageGetItem();
console.log(localData.visitor_country); // etc

请记住，如果在通过localStorage.setItem存储数据之前调用此属性，则每个属性都将为null 。

Answer 2

我知道我需要将价值作为回报，但是我不确定如何返回所有这3个getItem。

您可以将它们分配到新对象中，也可以像以前一样通过localStorage获取它们，因为它是全局属性。

但是Jaromanda X回答了为什么您不能拒绝他们的问题

var base_url = window.location.origin;
var myStorage = {}
$.when($.ajax({
type: 'POST',
url: base_url + '/demo/now',
dataType: 'json',
success: function(data) {

    localStorage.setItem('visitor_info', JSON.stringify(data.visitor_info));
    localStorage.setItem('visitor_country', data.visitor_country);
    localStorage.setItem('phone2', data.phone2);
    localStorage.setItem('countryUrl', data.countryUrl);
    myStorage = localStorage

}
})).then(console.log(myStorage));