Extjs可以';t通过'访问存储;setRootVisible';错误
当我使用Extjs Kitchen Sink 5中的一个树示例来制作自己的树时。我将得到如下“setRootVisible”错误:Extjs可以';t通过'访问存储;setRootVisible';错误,extjs,extjs5,Extjs,Extjs5,当我使用Extjs Kitchen Sink 5中的一个树示例来制作自己的树时。我将得到如下“setRootVisible”错误: Uncaught TypeError: Cannot read property 'setRootVisible' of undefined initComponent: function() { // declare store this.store = new app.store.Trees(); // declare all ite
Uncaught TypeError: Cannot read property 'setRootVisible' of undefined
initComponent: function() {
// declare store
this.store = new app.store.Trees();
// declare all items
this.items = [{
title: 'treeTest',
flex: 1
}];
this.callParent();
},
我在厨房水槽中使用了以下示例:
视图面板:
Ext.define('app.view.dashboard.widget.Tree', {
extend: "Ext.panel.Panel",
xtype: 'tree',
requires: [
'app.store.Trees',
'Ext.layout.container.VBox'
],
controller: "dashboard-tree",
viewModel: {
type: "dashboard-tree"
},
layout: {
type: 'hbox',
pack: 'start',
align: 'stretch'
},
defaults: {
xtype: 'treepanel',
frame: false,
rootVisible: true, // when true, the 'root' map will be shown
store: 'trees' // select store wich contains the tree data
},
initComponent: function() {
// declare all items of the tree
this.items = [{
flex: 1
}];
this.callParent();
}
});
这家树店来自Sencha厨房水槽:
Ext.define('app.store.Trees', {
extend: 'Ext.data.TreeStore',
xtype: 'store',
root: {
text: 'Ext JS',
expanded: true,
children: [
{
text: 'app',
children: [
{ leaf:true, text: 'Application.js' }
]
},
{
text: 'button',
expanded: true,
children: [
{ leaf:true, text: 'Button.js' },
{ leaf:true, text: 'Cycle.js' },
{ leaf:true, text: 'Split.js' }
]
},
{
text: 'container',
children: [
{ leaf:true, text: 'ButtonGroup.js' },
{ leaf:true, text: 'Container.js' },
{ leaf:true, text: 'Viewport.js' }
]
},
{
text: 'core',
children: [
{
text: 'dom',
children: [
{ leaf:true, text: 'Element.form.js' },
{ leaf:true, text: 'Element.static-more.js' }
]
}
]
},
{
text: 'dd',
children: [
{ leaf:true, text: 'DD.js' },
{ leaf:true, text: 'DDProxy.js' },
{ leaf:true, text: 'DDTarget.js' },
{ leaf:true, text: 'DragDrop.js' },
{ leaf:true, text: 'DragDropManager.js' },
{ leaf:true, text: 'DragSource.js' },
{ leaf:true, text: 'DragTracker.js' },
{ leaf:true, text: 'DragZone.js' },
{ leaf:true, text: 'DragTarget.js' },
{ leaf:true, text: 'DragZone.js' },
{ leaf:true, text: 'Registry.js' },
{ leaf:true, text: 'ScrollManager.js' },
{ leaf:true, text: 'StatusProxy.js' }
]
},
{
text: 'core',
children: [
{ leaf:true, text: 'Element.alignment.js' },
{ leaf:true, text: 'Element.anim.js' },
{ leaf:true, text: 'Element.dd.js' },
{ leaf:true, text: 'Element.fx.js' },
{ leaf:true, text: 'Element.js' },
{ leaf:true, text: 'Element.position.js' },
{ leaf:true, text: 'Element.scroll.js' },
{ leaf:true, text: 'Element.style.js' },
{ leaf:true, text: 'Element.traversal.js' },
{ leaf:true, text: 'Helper.js' },
{ leaf:true, text: 'Query.js' }
]
},
{ leaf:true, text: 'Action.js' },
{ leaf:true, text: 'Component.js' },
{ leaf:true, text: 'Editor.js' },
{ leaf:true, text: 'Img.js' },
{ leaf:true, text: 'Layer.js' },
{ leaf:true, text: 'LoadMask.js' },
{ leaf:true, text: 'ProgressBar.js' },
{ leaf:true, text: 'Shadow.js' },
{ leaf:true, text: 'ShadowPool.js' },
{ leaf:true, text: 'ZIndexManager.js' }
]
}
});
虽然这可能无法完全解决您的问题,但我认为您错误地扩展了ExtJs类:
Ext.define('app.view.dashboard.widget.Tree', {
extend: "Ext.panel.Panel",
xtype: 'tree',
应该扩展ExtJs树面板类,而不是标准面板,如下所示:
Ext.define('app.view.dashboard.widget.Tree', {
extend: "Ext.tree.Panel"
xtype配置项可通过以下方式使用:
您可以创建一个通用的Ext.小部件并定义其xtype,使用以下示例:
或者您可以定义自己的X类型,如下所示:
Ext.define('MyApp.PressMeButton', {
extend: 'Ext.button.Button',
xtype: 'pressmebutton',
text: 'Press Me'
});
参考资料:虽然这可能无法完全解决您的问题,但我相信您错误地扩展了ExtJs类:
Ext.define('app.view.dashboard.widget.Tree', {
extend: "Ext.panel.Panel",
xtype: 'tree',
应该扩展ExtJs树面板类,而不是标准面板,如下所示:
Ext.define('app.view.dashboard.widget.Tree', {
extend: "Ext.tree.Panel"
xtype配置项可通过以下方式使用:
您可以创建一个通用的Ext.小部件并定义其xtype,使用以下示例:
或者您可以定义自己的X类型,如下所示:
Ext.define('MyApp.PressMeButton', {
extend: 'Ext.button.Button',
xtype: 'pressmebutton',
text: 'Press Me'
});
参考资料:现在它对我来说很好用。我必须做的唯一一件事是为
initComponent:function(){}
中的项声明树存储
我用于获得商店的解决方案如下:
Uncaught TypeError: Cannot read property 'setRootVisible' of undefined
initComponent: function() {
// declare store
this.store = new app.store.Trees();
// declare all items
this.items = [{
title: 'treeTest',
flex: 1
}];
this.callParent();
},
我想这家商店是看不出商品的。但是现在它很好用。现在它对我很好用。我必须做的唯一一件事是为
initComponent:function(){}
中的项声明树存储
我用于获得商店的解决方案如下:
Uncaught TypeError: Cannot read property 'setRootVisible' of undefined
initComponent: function() {
// declare store
this.store = new app.store.Trees();
// declare all items
this.items = [{
title: 'treeTest',
flex: 1
}];
this.callParent();
},
我想这家商店是看不出商品的。但现在它工作正常。当我使用您的解决方案时,set-rootVisible错误已解决。但这棵树仍然没有显示商店里的任何商品。你现在知道我能做什么来解决它吗?当我使用你的解决方案时,set rootVisible错误就解决了。但这棵树仍然没有显示商店里的任何商品。你现在知道我能做什么来解决它吗?