간단한 트리 구조를 만들려고합니다. 저장소에서 json 데이터를 사용하여 구조를 만들려고합니다. tree.json는 다음과에Extjs : 트리 구조가 표시되지 않습니다.
여기 내보기 formTree.js
Ext.define('TestMVC.view.form.formTree', {
extend: 'Ext.form.FormPanel',
alias: 'widget.formTree',
itemId: 'form',
renderTo: Ext.getBody(),
requires: ['Ext.form.field.Text', '*', 'Ext.tip.*', 'Ext.tree.*','Ext.data.*','Ext.tip.*'],
layout: {
type: 'vbox',
padding: 20
}, //******************************
//bodyStyle: 'background-image:url(../images/eggplant.jpg)!important',
initComponent: function() {
// this.addEvents('create');
var required = '<span style="color:red;font-weight:bold" data-qtip="Required">*</span>';
Ext.QuickTips.init();
Ext.apply(this, {
activeRecord: null,
xtype:'treepanel',
store: new Ext.data.TreeStore({
proxy: {
type: 'ajax',
url: 'DataService/tree.json',
reader: {
type: 'json'
}
},
root: {
text: 'Ext JS',
id: 'src',
expanded: true
},
folderSort: true,
sorters: [{
property: 'text',
direction: 'ASC'
}] }),
viewConfig: {
plugins: {
ptype: 'treeviewdragdrop'
}
},
renderTo: Ext.getBody(),
height: 300,
width: 250,
, title: 'Files'
useArrows: true,
dockedItems: [{
xtype: 'toolbar',
items: [{
text: 'Expand All',
handler: function(){
tree.expandAll();
}
}, {
text: 'Collapse All',
handler: function(){
tree.collapseAll();
}
}]
}]
});
this.callParent();
}
});
그리고 JSON 데이터입니다. 이 실행에
{ text: 'Maths', id: 'mathDept', children: [
{ text:'X1', id: 'x1', leaf: true },
{ text:'X2', id: 'x2', leaf: true}
]
},
{ text: 'Biology', id: 'bioDept', children: [
{ text: 'Y1', id: 'y1', leaf: true},
{ text: 'Y2', id: 'y2', leaf: true}
]
},
{ text: 'English', id: 'engDept', children: [
{ text: 'Z1', id: 'z1', leaf: true},
{ text: 'Z2', id: 'z2', leaf: true},
{ text: 'Z3', id: 'z3', leaf: true}
]
}
나는 오류가 null의 속성 DOM을 읽을 수 없습니다 얻을. 도와주세요.
어쩌면 스크린 샷을 첨부 할 수 있습니까? – Andron
텍스트를 모두 확장하고 모두 접기 만 표시됩니다. 다른 것은 표시되지 않습니다. – arjun
'tree.json'의 데이터는 객체의 배열이어야합니다. 그렇지? – Andron