在Flex应用程序中,元数据被加载为XML具有很好的功能深深搜索到XML节点。 在ExtJS的版本,我已经转换XML数据到JSON,保持深层次的内容,并使用JSON读者正在加载到一个ExtJS商店。 我还没有创建一个模型,认为这不是必要的,因为模型不加任何添加搜索功能(?)。 我在看store.find,store.findBy可以使用函数,store.findRecord等,但这些功能看起来非常“一levelish”。 我需要去的“标签”“节点”,发现其子“标签”与“TAB1”“名称”,并找到它的属性,“标题”的价值......现在用的描述“节点”,但它是分层次的JSON数据。 我错过了,会做这个,我应该用店里的原始JSON数据存储功能 - 确实JSON有更好的搜索功能,或者我将向通过所有的“节点”的循环暴力破解的JavaScript? 我希望避免循环,找到某种功能。 与往常一样,TIA
Answer 1:
嗯,我从我们的看法不能理解的是,你需要一个还挺存储为快速,轻松地访问您的JSON数据成为可能。 JSON意味着JavaScript对象符号 ,所以它是一个对象!
好吧,我给你两个例子。 首先,设置JSON数据:
{
"users": [{
"user": {
"id": 0 ,
"name": "foo" ,
"age": 22 ,
"skills": [{
"type": "bowcrafting" ,
"skillLevel": 50 ,
"levels": [10, 25, 50, 75, 90, 95, 99, 100]
}]
}} , {
"user": {
"id": 1 ,
"name": "bar" ,
"age": 71 ,
"skills": [{
"type": "fencing" ,
"skillLevel": 32 ,
"levels": [10, 25, 50, 90, 95, 99, 100]
} , {
"type": "swordsmanship" ,
"skillLevel": 73 ,
"levels": [10, 25, 50, 75, 80, 85, 90, 95, 99, 100]
}]
}} , {
"user": {
"id": 2 ,
"name": "foobar" ,
"age": 132 ,
"skills": [{
"type": "tactics" ,
"skillLevel": 90 ,
"levels": [10, 25, 50, 90, 95, 99, 100]
} , {
"type": "carpentery" ,
"skillLevel": 86 ,
"levels": [10, 25, 50, 75, 90, 95, 99, 100]
} , {
"type": "hiding" ,
"skillLevel": 100 ,
"levels": [10, 25, 50, 65, 75, 80, 85, 90, 95, 99, 100]
}]
}
}]
}
而现在我们在这里有两种方法如下:
第一种方式 :我们可以想象保存到一个文件名为嵌套json.json上面的JSON,我们用一个简单的存储读取它。 比,我们可以使用findBy搜索找到我们所需要的:
var jstore = Ext.create ('Ext.data.Store', {
fields: ['id', 'name', 'age', 'skills'] ,
proxy: {
type: 'ajax' ,
url: 'nested-json.json' ,
reader: {
type: 'json' ,
root: 'users' ,
record: 'user' ,
idProperty: 'id'
}
} ,
autoLoad: true
});
Ext.create ('Ext.button.Button', {
text: 'Push me' ,
renderTo: Ext.getBody () ,
handler: function (btn) {
var index = jstore.findBy (function (user, id) {
// Here's the hint
if (user.data.skills.skillLevel === 50) return id;
else return -1;
});
if (index != -1) {
// It will print 'foo' because it's the user
// that has the skillLevel equal to 50
console.log (jstore.getAt(index).get ('name'));
}
}
});
另一种方法是设想上述JSON 为对象 ,直接从原始JSON数据读取。 在这一点上,只是把它作为一个JavaScript对象:
// Users model: required by JSON reader
Ext.define ('Users', {
extend: 'Ext.data.Model' ,
fields: ['id', 'name', 'age', 'skills']
});
// JSON reader
var jreader = Ext.create ('Ext.data.reader.Json', {
model: 'Users' ,
root: 'users' ,
record: 'user' ,
idProperty: 'id'
});
// Reads records directly from raw JSON
var users = jreader.readRecords ({
"users": [{
"user": {
"id": 0 ,
"name": "foo" ,
"age": 22 ,
"skills": [{
"type": "bowcrafting" ,
"skillLevel": 50 ,
"levels": [10, 25, 50, 75, 90, 95, 99, 100]
}]
}} , {
"user": {
"id": 1 ,
"name": "bar" ,
"age": 71 ,
"skills": [{
"type": "fencing" ,
"skillLevel": 32 ,
"levels": [10, 25, 50, 90, 95, 99, 100]
} , {
"type": "swordsmanship" ,
"skillLevel": 73 ,
"levels": [10, 25, 50, 75, 80, 85, 90, 95, 99, 100]
}]
}} , {
"user": {
"id": 2 ,
"name": "foobar" ,
"age": 132 ,
"skills": [{
"type": "tactics" ,
"skillLevel": 90 ,
"levels": [10, 25, 50, 90, 95, 99, 100]
} , {
"type": "carpentery" ,
"skillLevel": 86 ,
"levels": [10, 25, 50, 75, 90, 95, 99, 100]
} , {
"type": "hiding" ,
"skillLevel": 100 ,
"levels": [10, 25, 50, 65, 75, 80, 85, 90, 95, 99, 100]
}]
}
}]
});
// Here's the magic
Ext.each (users.records, function (user) {
console.log ('*** USER ***');
console.log (user);
console.log ('id: ' + user.get ('id'));
console.log ('name: ' + user.get ('name'));
console.log ('age: ' + user.get ('age'));
Ext.each (user.get ('skills'), function (skill) {
console.log ('*** SKILL ***');
console.log (skill);
console.log ('type: ' + skill.type);
console.log ('level: ' + skill.skillLevel);
console.log ('*** LEVELS ***');
Ext.each (skill.levels, function (level) {
console.log (level);
});
});
});
这里有一个的jsfiddle来测试这最后一个: 的jsfiddle
我希望能明白你的要求是什么。 如果我没有,请让我知道跟自己做出了表率;)
文章来源: extjs searching deep into store data?