如何使用 firebug 调试 Extjs store url: path ？

Question

我正在使用 浏览器-我的应用程序的布局示例。

我正在尝试添加 树网格< /strong> 到它。我定义了一个新类，但是当我调用树网格时，我可以看到网格，但里面没有数据。

我想做的是在单独的文件中定义树网格。我的主文件是 layout-browser.js，我需要将其添加到其中的选项卡中。我可能做错了什么？

这是我的代码：

Ext.require([
'Ext.data.*',
'Ext.grid.*',
'Ext.tree.*'
]);

Ext.define('Task', {
    extend: 'Ext.data.Model',
    fields: [
        { name: 'task', type: 'string' },
        { name: 'user', type: 'string' },
        { name: 'duration', type: 'string' }
    ]
});

var store = Ext.create('Ext.data.TreeStore', {
    model: 'Task',
    proxy: {
        type: 'ajax',
        //the store will get the content from the .json file
        url: 'treegrid.json'
    },

    folderSort: true
});



var tree = new Ext.tree.Panel({
title: 'Core Team Projects',
store : store,

columns:[
{
    header: 'Task',
    dataIndex: 'task',
    width: 80
},{
    header: 'Duration',
    width: 80,
    dataIndex: 'duration',
    //align: 'center',
    //sortType: 'asFloat'

},{
    header: 'Assigned To',
    width: 80,
    dataIndex: 'user'
}] 
});


Ext.define("Ext.app.myTreeGrid", {
    extend: "Ext.panel.Panel",


width: 300,
height : 300,
items: [tree]

});

感谢您的时间和帮助

Answer 1

var store = Ext.create('Ext.data.TreeStore', {
proxy:{
    type: 'ajax',
    url: 'myTree.json',
},
reader:{
    type: 'ajax',
    root: 'nodes',
    record: 'leaf'
 }  
}); 


var myTree = Ext.create('Ext.tree.Panel', {
    store: store,
    rootVisible: false,  
    border: false,
    renderTo:Ext.getBody() //missing

});  

JSON

  {

    children: [
        { text:"Clients", expanded: true,
            children: [{ text:"MAIN", leaf: true }]
        }
    ]
  }

这是一个工作示例，您可以定义 myTree 并在浏览器布局中调用它！

转到 firebug NET 控制台，刷新页面并搜索 treeGrid.json，

将鼠标悬停在上面即可查看完整的 URL

使用从本地存储到包含 .json 的文件夹的正确路径更新存储

立即尝试！