我正在尝试使用Sencha Touch应用程序中的localStorage构建一个商店。
我想从localStorage [“feeds”]获取数据的localStorage看起来像这样:
"[{"title":"Title 1","url":"http://stackoverflow.com"},
{"title":"Title2","url":"http://google.com"}]"
我正试图通过以下内容进入商店:
var feedsPanel;
var store;
Ext.setup({
icon: 'icon.png',
glossOnIcon: false,
onReady: function(){
Ext.regModel("feedModel", {
fields: [
{ name: "title", type: "string" },
{name: "url", type:"string"}
]
});
store = new Ext.data.Store({
proxy: new Ext.data.LocalStorageProxy({
id: 'feeds'
}),
model:"feedModel"
});
当我在Chrome中尝试store.load()时,由于TypeError而失败:无法读取null的属性'title'。
我该如何访问本地存储的每个标题和每个网址?
看着纸牌游戏的例子让我头晕目眩。
我的Sencha应用程序的其余部分现在不依赖于这个商店,并且完全加载。我通过Chrome中的控制台检查商店中是否有商品。
答案 0 :(得分:1)
本地存储是否已在其中包含具有不同模型“架构”的条目?只是一个想法:尝试不同的代理ID。
但我认为你注册商店比直接实例化更好。尝试:
Ext.regStore('store', {
proxy: {...}
...
);
然后
store:'store'
列表中的或与其绑定的任何内容。
答案 1 :(得分:1)
此类localStorage格式并非特定于Sencha Stores。但是如果你真的需要从以这种方式格式化的localStorage中读取,你可以尝试以下方法。有可能: - )
// first prefill localStorage
var feeds = [], j = 0;
while (j < 25) {
feeds.push({'title': 'Title ' + ++j, url: 'http://link' + j + '.com'});
}
localStorage.setItem('feeds', Ext.encode(feeds));
// Sencha Touch v1 Application
new Ext.Application({
name: 'App',
launch: function() {
var store = new Ext.data.JsonStore({
id: 'feedstore',
fields: ['title', 'url'],
autoload: true,
proxy: {
id: 'feedproxy',
type: 'memory',
url: 'feeds',
create: function () {
console.log('feed: CREATE');
},
read: function (operation, callback, scope) {
console.log('feed: READ');
var data = localStorage.getItem(this.url),
i, len, records = [];
console.log('data: ' + data);
data = Ext.decode(data);
if (Ext.isArray(data)) {
len = data.length;
for (i = 0; i < len; ++i) {
records.push(new this.model(data[i]));
};
// return model instances in a result set
operation.resultSet = new Ext.data.ResultSet({
records: records,
total : len,
loaded : true
});
// announce success
operation.setSuccessful();
operation.setCompleted();
// finish with callback
if (typeof callback == "function") {
callback.call(scope || this, operation);
}
Ext.getBody().unmask();
}
},
update: function () {
console.log('feed: UPDATE');
},
destroy: function () {
console.log('feed: DESTROY');
},
reader: {
type: 'json'
}
}
}).load();
this.viewport = new Ext.Panel({
fullscreen: true,
layout: 'card',
items: [{
xtype: 'list',
itemTpl : '{title}<br />{url}',
store: store
}]
});
}
});