extjs怎么加载js文件 生成左边的树形菜单

JavaScript023

extjs怎么加载js文件 生成左边的树形菜单,第1张

研究一下 extjs的tree树形结果,已经封装的很简单了

Ext.require([

'Ext.tree.*',

'Ext.data.*'

])

Ext.onReady(function() {

var store = Ext.create('Ext.data.TreeStore', {

proxy: {

type: 'ajax',

url: 'get-nodes.php',

extraParams: {

isXml: true

},

reader: {

type: 'xml',

root: 'nodes',

record: 'node'

}

},

sorters: [{

property: 'leaf',

direction: 'ASC'

},{

property: 'text',

direction: 'ASC'

}],

root: {

text: 'Ext JS',

id: 'src',

expanded: true

}

})

// create the Tree

var tree = Ext.create('Ext.tree.Panel', {

store: store,

hideHeaders: true,

rootVisible: true,

viewConfig: {

plugins: [{

ptype: 'treeviewdragdrop'

}]

},

height: 350,

width: 400,

title: 'Directory Listing',

renderTo: 'tree-example',

collapsible: true

})

})

然后根据鼠标左键在菜单坐标内按下放开的事件提取当前鼠标的x,y坐标,然后修改属性菜单的top和left属性 或者当鼠标在菜单坐标内按下之后触发鼠标的移动事件,然后在移动事件里设置菜单的top和left对应鼠标当前坐标y和x,这样当鼠标移动时菜单的坐标也会根本改变,实现同步移动