树组件:主要配置项、属性、方法
1、Ext.tree.TreePanel
主要配置项:
root:树的根节点。
rootVisible:是否显示根节点,默认为true。
useArrows:是否在树中使用Vista样式箭头,默认为false。
lines:是否显示树线,默认为true。
loader:树节点的加载器,默认为Ext.tree.TreeLoader。
selModel:树的选择模式,默认为Ext.tree.DefaultSelectionModel。
pathSeparator:树节点路径的分隔符,默认为“/”。
singleExpand:是否一次只展开树中的一个节点,默认为true。
requestMethod:请求方法,可选值有POST、GET。
containerScroll:是否将树形面板注册到滚动管理器ScrollManager中。
主要方法:
collapseAll():收缩所有树节点
expandAll():展开所有树节点
getRootNode():获取根节点
getNodeById(String id):获取指定id的节点
expand( [Boolean deep], [Boolean anim], [Function callback], [Object scope] )
expandPath( String path, [String attr], [Function callback] )
getChecked( [String attribute], [TreeNode startNode] )
selectPath( String path, [String attr], [Function callback] )
getSelectionModel():
2、Ext.data.Node
主要配置项:
id:节点id
leaf:当前节点是否为叶子节点
主要属性:
id:节点id
attributes:节点属性的集合
parentNode:当前节点的父节点
childNodes:当前节点所有子节点组成的数组
firstChild:当前节点的第一个直接子节点,如果没有则为null值
lastChild:当前节点的最后一个直接子节点,如果没有则为null值
nextSibling:当前节点的下一个兄弟节点,如果没有则为null值
previousSibling:当前节点的前一个兄弟节点,如果没有则为null值
主要方法:
appendChild( Node/Array node ):追加新的子节点
bubble( Function fn, [Object scope], [Array args] ):从当前节点开始向上迭代调用指定函数,如果指定函数返回false则将终止迭代。
args:传入函数中的参数,默认为当前节点
cascade( Function fn, [Object scope], [Array args] ):从当前节点开始向下迭代调用指定函数,如果指定函数返回false则将终止迭代。
contains( Node node ):当前节点是否包含指定子节点。
eachChild( Function fn, [Object scope], [Array args] ):迭代当前节点的所有子节点调用指定函数,如果指定函数返回false则将终止迭代。
findChild( String attribute, Mixed value ):查找具有指定属性的第一个子节点。
findChildBy( Function fn, [Object scope] ):根据自定义函数查找第一个符合要求的子节点,如果自定义函数返回true则说明匹配成功。
getDepth():取得当前节点的深度,根节点的深度为0
getOwnerTree():取得当前节点所在树。
getPath( [String attr] ):取得当前节点对应的路径,这个路径在程序中可用于展开或者选择节点。
attr:用于查找路径的属性,默认为节点id
hasChildNodes():是否有子节点
indexOf( Node node ):取得指定子节点的索引值,未找到返回-1。
insertBefore( Node node, Node refNode ):在当前节点的指定子节点之前插入一个新的子节点。
node:要插入的新节点
isAncestor( Node node ):判断指定节点是否为当前节点的父节点(可以是任何一级中的父节点)。
isFirst():是否为父节点的第一个子节点。
isLast():是否为父节点的最后一个子节点。
isLeaf():是否为叶子节点。
item( Number index ):取得指定索引的子节点。
remove():从父节点中删除当前节点。
removeChild( Node node ):删除当前节点的指定子节点。
replaceChild( Node newChild, Node oldChild ):用新的子节点替换当前节点的指定子节点。
sort( Function fn, [Object scope] ):用指定的排序函数为当前节点的子节点进行排序。
3、Ext.tree.TreeNode
主要配置项:
text:节点上的文本信息
qtip:节点上的提示信息
icon:节点图标对应的路径
iconCls:应用到节点图标上的样式
checked:当前节点的选择状态
true:在节点前显示一个选中状态的复选框
false:在节点前显示一个未选中状态的复选框
不指定该值:不显示任何复选框
href:节点的连接属性,默认为#
hrefTarget:显示节点连接的目标框架
editable:是否允许编辑,默认为true
expanded:是否展开节点,默认为false
disabled:是否禁用节点,默认为false
singleClickExpand:是否通过单击方式展开节点
allowChildren:是否允许当前节点具有子节点,默认为true
expandable:当不含子节点时,是否总显示一个加减图标,默认为false
uiProvider:节点的UI类,默认为Ext.tree.TreeNodeUI
主要属性:
text:节点上的文本信息
disabled:当前节点是否被禁用
主要方法:
collapse( [Boolean deep], [Boolean anim], [Function callback], [Object scope] ):收缩当前节点
deep:是否级联收缩全部子节点
collapseChildNodes( [Boolean deep] ):收缩所有子节点
disable():禁用当前节点
enable():启用当前节点
ensureVisible( [Function callback], [Object scope] ):确保所有父节点都是展开的
expand( [Boolean deep], [Boolean anim], [Function callback], [Object scope] ):展开当前节点
expandChildNodes( [Boolean deep] ):展开所有子节点
isExpanded():当前节点是否展开
isSelected():当前节点是否被选中
select():选择当前节点
setText( String text ):设置当前的文本
toggle():切换当前节点的展开和收缩状态
unselect():取消对当前节点的选择
getUI():取得节点的UI对象
4、Ext.tree.AsyncTreeNode
主要配置项:
loader:当前节点的树加载器,默认使用树中配置的树加载器
主要方法:
isLoaded():当前节点是否已经加载数据
reload( Function callback, [Object scope] ):重新加载节点数据,并调用回调函数
5、Ext.tree.TreeNodeUI
主要方法:
getAnchor():从节点的UI中获取焦点的<a>元素
getIconEl():获取图标的<img>元素
getTextEl():获取文本节点
addClass( String/Array className ):
removeClass( String/Array className ):
hide():
show():
isChecked():取得节点的选择状态,如果当前节点没有复选框则函数返回false
toggleCheck( Boolean (optional) ):设置节点复选框的选择状态
6、Ext.tree.RootTreeNodeUI
7、Ext.tree.DefaultSelectionModel
是TreePanel的默认选择模式,该模式一次只能选择树中的一个节点。
主要方法:
clearSelections():清除对树中所有节点的选择
getSelectedNode():取得当前被选中的节点
isSelected( TreeNode node ):节点是否被选中
select( TreeNode node ):选中指定节点
unselect( TreeNode node ):取消指定节点的选中状态
selectNext():选择当前被选节点的下一个节点
selectPrevious():选择当前被选节点的上一个节点
8、Ext.tree.MultiSelectionModel
是TreePanel的多选择模式,该模式一次可以选择树中的多个节点。
主要方法:
clearSelections():清除所有节点的选中状态
getSelectedNodes():取得被选节点组成的数组
isSelected( TreeNode node ):节点是否被选中
select( TreeNode node, [EventObject e], Boolean keepExisting ):选中指定节点
unselect( TreeNode node ):取消指定节点的选中状态
9、Ext.tree.TreeLoader
提供了对子节点的延时加载功能,请求指定的URL地址,返回子节点数据,返回的数据格式如下:
- [
- {
- id: 1,
- text: "node1",
- leaf: true,
- check: false
- },
- {
- id: 2,
- text: "node2",
- children: [
- {
- id: 3,
- text: "node3",
- leaf: true
- }
- ]
- }
- ]
[{id: 1,text: "node1",leaf: true,check: false},{id: 2,text: "node2",children: [{id: 3,text: "node3",leaf: true}]} ]
树节点展开时,当前节点的id会作为请求参数被发送到服务器,在服务器可以通过node参数名进行获取。
主要配置项:
dataUrl:获取子节点的URL地址。
baseAttrs:子节点的基本属性对象,该对象中的属性将被添加到树加载器创建的所有子节点上。优先服务器返回的同名属性值。
baseParams:基本的请求参数,这些参数会被附加到每一个节点的请求中。
clearOnLoad:在加载前是否移除已存在的子节点,默认为true。
preloadChildren:在第一次加载子节点后是否递归加载所有子节点。
requestMethod:请求方法,可选值有POST、GET。
uiProviders:加载器创建子节点的UI实现类。
url:与dataUrl作用相同。
主要方法:
load( Ext.tree.TreeNode node, Function callback, (Object) scope ):从指定的URL加载树节点。
node:需要加载子节点的树节点。
10、Ext.tree.TreeEditor
主要配置项:
alignment:对齐方式。
editDelay:两次点击节点触发编辑操作的延时时间,默认为350毫秒。
hideEl:在显示编辑器组件时是否隐藏绑定元素。
maxWidth:编辑器的最大宽度,默认为250。
11、Ext.tree.TreeSorter
主要配置项:
property:用于排序的节点属性名,默认为text。
dir:排序方向,可选值有asc、desc,默认为asc。
caseSensitive:是否区分大小写,默认为false。
folderSort:叶节点是否排在非叶节点之下,默认为false。
leafAttr:叶子节点在folder排序时的值,默认为leaf。
sortType:一个自定义函数用于在排序前转换节点值。
转载于:https://www.cnblogs.com/yangxq5858/archive/2011/02/05/1949234.html
树组件:主要配置项、属性、方法相关推荐
- php easyui tree 结构,EasyUI Tree树组件无限循环的解决方法
在学习jquery easyui的tree组件的时候,在url为链接地址的时,发现如果最后一个节点的state为closed时,未节点显示为文件夹,单击会重新加载动态(Url:链接地址)形成无限循环. ...
- c# BackgroundWorker组件介绍(属性、方法、事件)
c# BackgroundWorker组件介绍(属性.方法.事件) 2008-07-03 16:28 在VS2005中添加了BackgroundWorker组件,该组件在多线程编程方面使用起来非常方便 ...
- 【Android 应用开发】Android UI 设计之 TextView EditText 组件属性方法最详细解析
. 作者 :万境绝尘 转载请注明出处 : http://blog.csdn.net/shulianghan/article/details/18964835 . TextView 相关类的继承结构 ...
- React创建组件的方法,组件的props属性、state属性的用法和特点,父子组件传值,兄弟组件传值
创建组件的方法,组件的props属性.state属性的用法和特点,父子组件传值,兄弟组件传值 1.react组件 1.1.创建组件的方法 1.1.1.函数组件 定义一个组件最简单的方式是使用JavaS ...
- 子组件调用父组件方法_Vuejs组件(一)组件的注册使用方法
点击上方"蓝字",发现更多精彩.前言 又到了愉快的周末,今天下了一天的雨了,我又日常宅宿舍打游戏.刷剧.听音乐写写代码. 前面的基础语法记录完了,接下记录的Vue的组件 01认识组 ...
- HT for Web的HTML5树组件延迟加载技术实现
HT for Web的HTML5树组件有延迟加载的功能,这个功能对于那些需要从服务器读取具有层级依赖关系数据时非常有用,需要获取数据的时候再向服务器发起请求,这样可减轻服务器压力,同时也减少了浏览器的 ...
- ant vue 树形菜单横向显示_快速实现一个简单可复用可扩展的Vue树组件
来源 | https://wintc.top/article/13大概因为平时工作项目的原因,写了很多次树形组件,越写越觉得可以写得更简单并且更具有复用性.扩展性.树组件的应用场景很多,比如一篇文章的 ...
- Vue 人资 实战篇七 员工管理上 封装通用的组件、formatter属性、过滤器的使用、树形结构、建立公共导入的页面路由、excel的导入和导出、
1.0 封装一个通用的工具栏 目标:封装一个通用的工具栏供大家使用 1.1 通用工具栏的组件结构 在后续的业务开发中,经常会用到一个类似下图的工具栏,作为公共组件,进行一下封装 组件 src/comp ...
- Vue组件传值(props属性,父到子,子到父,兄弟传值)
文章目录 @[TOC](文章目录) 前言 一.props是什么? 使用规则 二.父传子 props 实现步骤 代码实现 效果展示 二.子传父 $emit 实现步骤 代码实现 效果展示 三.兄弟传值 E ...
最新文章
- 利用最小二乘法求解仿射变换参数
- 使用python 打造中国的电影光魔
- 24.二叉树中和为某一值的路径
- matlab mod()rem()
- Spring cloud gateway的自定义异常响应
- 腾讯面试后续 | 掘金技术征文
- Python之值得学习练手的22个迷你程序(附代码)
- 由于找不到appvisvsubsystems32.dll_找茬游戏大全:我找东西贼快!小清新找茬游戏小程序,点开既玩...
- Qt奇淫技巧-使用QSharedMemory方式实现数据跨界面传输
- 怎么创建数据表的实体类和业务类_SSM搭建二手市场交易平台(二):数据表设计...
- 关于表单元素input的美化
- python查询当前路径_python获取当前目录路径和上级路径的实例
- 统一建模语言 UML
- Hadoop运行原理详解
- matlab中polyfit和polyval的使用(曲线拟合/多项式拟合/指数拟合)
- 三步激活win10(转)
- 解决Linux下adb devices找不到设备
- bilibili 弹幕协议分析,golang 还原代码
- hdu2094 c语言
- cf反恐穿越前线java,穿越前线反恐使命
热门文章
- python2升级_Python2 升级 Python3
- fastreport调用frf文件直接打印_打印日志时 Logback 内部都做了些什么
- python如何打开txt文件、并算词频_Python 合并多个TXT文件并统计词频的实现
- 高性能计算机储存部件硬盘,高性能计算机的磁盘系统结构.pdf
- 系统学习深度学习(十九)--GoogLeNetV1,V2,V3
- 双目测距(六)--三维重建及UI显示
- 决策树(一)--ID3
- java matches方法
- 再论DataSet与DataFrame的区别
- Win32汇编——多线程