介绍现在项目中使用到的dojo tree

前端之家收集整理的这篇文章主要介绍了介绍现在项目中使用到的dojo tree前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

在我们项目中也如上篇文章介绍的那样,使用dojo中的dijit.tree,如下代码所示,大家可以看出,动态语言给我们很充足的可编程性。 主要提供:打开节点、拖拽排序等常用功能

       
        //创建数据源,确定基本根节点以及其children节点
	var treeItems  = [ {
		id : "root",displayNameCh : _rootLabel,displayNameEn : _rootLabel,children : allItems
	} ];
				
	this.loadTreeByData (treeItems);

        loadTreeByData : function(/*数据源*/treeItems){
		
		
		var localeName = dojo.locale;
		var displayName = "";

               //国际化设置
		if (localeName == "zh" || localeName == "zh-cn") {
			displayName = "displayNameCh";
		} else {
			displayName = "displayNameEn";
		}
		
		var data = {
			identifier : "id",label : displayName,items : treeItems
		};

               //把数据源treeItems包装一下
		this.workStore = new dojo.data.ItemFileWriteStore({
			data : data
		});
		
                //根据TreeStoreModel特性来创建tree所需model
		this.workModel = new dijit.tree.TreeStoreModel({
			store : this.workStore,childrenAttrs : [ "children" ]
		});

                //存在tree,则销毁
		if (this.workTree) {
			this.logger.debug("Destroy old tree");
			if (this.workTree.destroyRecursive) {
				this.workTree.destroyRecursive();
			} else if (this.workTree.destroy) {
				this.workTree.destroy();
			}
			this.workTree = null;
		}

               //创建tree单元,这里使用了一些tree相关的高级应用
		this.workTree = new dijit.Tree({
			model : this.workModel,openOnClick : false,dndController : "dijit.tree.dndSource",betweenThreshold : 5,onOpen : dojo.hitch(this,this.onRetrieveTag),onClick : dojo.hitch(this,this._onClickItem),onDblClick : dojo.hitch(this,this._onDbClickItem),checkItemAcceptance : dojo.hitch(this,this.onCheckItemAcceptance),persist : false
		});

		this.workTree.placeAt(this.containerNode);
		this.startup();
		
                //用于处理树节点之间的拖拽响应
		this.connect(this.workTree.dndController,'onMouseDown',function(e) {
			// 如果你的树上有滚动条,请加入如下代码,否则如果你选中了节点后拖动滚动条会出现节点拖拽
			if (dijit.getEnclosingWidget(e.target) == this.workTree) {
				this.workTree.dndController.mousedown = false;
				return;
			}
		});
	},
原文链接:https://www.f2er.com/dojo/291500.html

猜你在找的Dojo相关文章