####设计器的拖拽能力 nid要保持唯一，对于tab等组件既存在头部又存在内容区的，内容区要在原有nid基础上增加_body,选中内容区返回的nid会将_body去掉。

DND.init({
    dragShowBorder:true,//拖拽过程中是否显示目标边框和标题名
    
    //初始化完成后触发的事件
    onInitFinish:function(){},
    
    //当拖动开始时触发的事件
    onDragStart:function({
        event,   //事件对象
        dragtype,//拖拽类型create-创建、move-移动
        elem,      //为dom元素
        nid,     //为组件的nid值
        uiType   //为组件的uitype值
    }){},
    
    //当拖拽结束时触发的事件
    onDragEnd:function({
        event,
        dragtype,//拖拽类型create-创建、move-移动，当为false表示不允许放置
          selected: {//拖抓的目标
            elem,
            nid,
            uiType,
          },
          target: {//放置的目标
            elem,
            nid,
            uiType
          },
          position  //放置的位置
    }){},
    
    //当画布中组件元素被选中时触发的事件
    onChoose:function({
        event,
        elem,
        nid,
        uiType
    }){},
    
    //当点击删除按钮时触发的事件
    onDelete:function({
        event,
        elem,
        nid,
        uiType
    }){},
    /**
     * 自定义判断当前拖抓元素是否可放置在目标元素上
     * @return true，则允许放置
     * @return false，则不允许放置
     * @return undefined，则走默认判定
     */
    onCanDrop:function({
        isCan,//默认判定出的是否可放置的结果
        dragNid,//抓取目标的nid
        dragUiType,//抓取目标的uitype
        dragUiData:{//抓取目标的uidata
            isPart, //是否部件
            isExt,  //是否扩展组件
            source  //原始数据
        },
        targetNid,//放置目标的nid
        targetUiType,//放置目标的uitype
        targetUiParams,//放置目标的uiparams
        tplTree,//层次树数据
        initData//初始化的全局数据
    }){},
    /**
     *自定义判断当前拖抓元素进过目标元素时显示的可插入位置点 
     *@return true则表示显示上下插入点，false则显示左右插入点
     */
    onDropPosition:function({
        event,
        dragNid,//抓取目标的nid
        dragUiType,//抓取目标的uitype
        dragUiData:{//抓取目标的uidata
            isPart, //是否部件
            isExt,  //是否扩展组件
            source  //原始数据
        },
        targetElem,//放置目标的dom元素
        targetNid,//放置目标的nid
        targetUiType,//放置目标的uitype
        targetUiParams,//放置目标的uiparams
        tplTree,//层次树数据
        initData//初始化的全局数据
    }){},
    
    //自定义扩展按钮被点击时触发的事件
    onButtonClick:function({
        event,
        elem,
        nid,
        uiType,
        buttonKey,//自定义按钮的键值
    }){}
});

####特殊说明 1.需要支持拖拽能力的DOM元素必须生成nid、uitype属性，例如：

<div nid="nid_1581070621610_1" uitype="button"></div>

2.由于拖拽默认会拦截所有点击事件，如需要在一些DOM元素上实现自定义点击，必须生成dndclickarrow属性，例如：

<div dndclickarrow  click="javascript:function(){alert('自定义点击事件')}"></div>