Вы на правильном пути, я бы сказал, но сохраните ваши данные в JavaScript в первую очередь. И соедините его с местным хранилищем, когда это подходит.
Когда я создаю такие приложения, как тот, который вы описываете, я обычно стараюсь настроить представления JavaScript для данных, получаемых через API.
Одно из таких представлений может выглядеть следующим образом. Имейте в виду, что приведенный ниже пример кода делает несколько предположений.
- Это делает предположение о том, что у вас есть в
api объекте, определенный, заботящийся вызовов API, и вызывает функцию обратного вызова по завершению.
- , что данные, возвращаемые API, являются JSON, которые просто могут быть назначены переменной JavaScript,
- То, что возвращенный JSON представляет собой список объектов, каждый из которых имеет поле «id».
- Что у вас есть какой-то объект события, я обычно создаю свои собственные события, которые в основном несут объекты
function в качестве слушателей, а когда они запускаются через прослушиватели и вызывают функции с полезной нагрузкой или без нее в зависимости от ситуации. Пример контейнера
данных:
MYAPP.data.BaseContainer = function (api_url, loadedEvent) {
var self = {
// Array to store the data returned via the APIs
_data : [],
// The API URL used to fetch data
api_url : api_url,
// Boolean flag to signify whether the _data variable has been populated
is_loaded : false,
// The even to fire once _data has been populated
loadedEvent : loadedEvent,
/**
* Returns the state of the is_loaded variable
*/
loaded : function() {
return self.is_loaded;
},
/**
* Takes an ID and returns any member of the _data array
* that has that ID.
*
* @param id : an String or integer representing the ID.
* @returns {Object}
*/
byId : function (id) {
var toReturn = null;
for (var i = 0, len = self._data.length; i < len; i++) {
if (self._data[i].id == id) {
toReturn = self._data[i];
break;
}
}
return toReturn;
},
/**
* Returns the entire _data array.
*/
all : function() {
return self._data;
},
/**
* This simple callback just stores the json response in
* its entirety on the _data variable.
*/
callback : function(data) {
self._data = data;
self.is_loaded = true;
loadedEvent.fire(self._data);
},
/**
* Calls the API, if no callback has been specified as a parameter
* self.callback is used.
*/
getFromAPI : function(callback) {
if (typeof callback === 'undefined') {
callback = self.callback;
}
api.get(self.api_url, callback);
}
};
self.getFromAPI();
return self;
};
С этим планом теперь я могу создать специальные контейнеры данных, как это:
/**
* Stores a list of "friends" gotten from the API.
* This is basically an instance of the BaseContainer object defined above.
*/
MYAPP.data.Friends = (function() {
var self = MYAPP.data.BaseContainer("API_URL_TO_FECTH_FRIENDS_LIST", FriendsLoadedEvent);
return {
byId : self.byId,
all : self.all,
loaded : self.loaded
};
}());
Как только этот код выполняется, вызов API сделан , и FriendsLoadedEvent будет запущен, когда это будет сделано. Поэтому, если честно, я обычно использую JavaScript для хранения моих вещей. Но если вы хотите бросить LocalStorage в микс, это тоже легко!
Просто добавьте локальный код хранилища в объект BaseContainer, который сначала определяет, действительно ли клиент поддерживает localstorage, и если это зеркало поля _data в локальном хранилище. Это удобно для быстрого доступа к часто используемым данным между сеансами. Используйте доступные JSON-инструменты для преобразования данных из JSON в «Text» и обратно в LocalStorage.
Просто имейте в виду, что вы не можете полагаться на LocalStorage как на свою основную структуру данных, у вас нет гарантии, что клиент поддерживает ее, и даже когда она выполняет верхнюю границу для того, сколько данных вы фактически можете хранить, отличается от браузеры. Поэтому использовать его для хранения данных, которые:
- Вы хотите получить доступ к очень часто,
- , что вы чувствуете, просто должны быть там, сразу же, как только пользователь войдет в,
- и не меняется часто достаточно, чтобы постоянно обновлять API-вызовы.
Почему голос? –
Я не проголосовал за вас - у меня даже нет этой функции, разблокированной. Если бы я должен был догадаться, кто-то неправильно истолковал ваш ответ как сарказм. – Steve