APIbeta

dom

Introduce

libs提供了dom工具, 目前可以用于判断对象是否是vue对象或vue组件.

使用dom对象能够处理浏览器兼容性, 例如, addEventListener 能够兼容firefox以及其他浏览器;

getElementOffset 能够很好计算BackCompat模式以兼容各个浏览器

以下方法以bpui.libs.dom.xxx方式使用

isVueObject

判断对象是否是vue对象.

1
2
3
4
5
/**
* @desc: 判断是否是vue对象.
* @return: 
*/
function isVueObject(obj:any):boolean;

isVueComponent

判断对象是否是vue组件.

1
2
3
4
5
/**
* @desc: Component 是import的, 未创建.
* @return: 
*/
function isVueComponent(obj:any):boolean;

isHtmlDom

1
2
3
4
5
/**
* @desc: 判断是否是html dom对象.
* @return: boolean.
*/
function isHtmlDom(e: any): boolean;

getViewPort

1
2
3
4
5
/**
* @desc: 获得视口大小.
* @return: {width, height}
*/
function getViewPort(): { width: number, height: number };

getDocumentPort

1
2
3
4
5
/**
* @desc: 获得文档大小.
* @return: {width, height}
*/
function getDocumentPort(): { width: number, height: number };

getDocumentOffset

1
2
3
4
5
/**
* @desc: 获得document scroll offset.
* @return: {top, left}
*/
function getDocumentOffset(): { top: number, left: number };

getElementOffset

1
2
3
4
5
/**
* @desc: 获取指定元素相对于视口的的offset
* @return: 
*/
function getElementOffset(e: any): { left: number, top: number };

addEventListener

1
2
3
4
/**
* @desc: 统一处理 addEventListener, attachEvent; 并提供useCapture参数问题.
*/
function addEventListener(domElement:any, event:string, func:any, useCapture?:boolean):null;

removeEventListener

1
2
3
4
/**
* @desc: 统一处理 removeEventListener, detachEvent; 并提供useCapture参数问题.
*/
function removeEventListener(domElement:any, event:string, func:any, useCapture?:boolean):null;

probeDom

在vue中数据改变后, 一般认为在 Vue.nextTick() 中视图更新; 而实际上, 仅改变了VirtualDOM, 某些DOM更新到真实视图上需要较多时间, 而此时操作可能会出现错误;

可以使用 probeDom 方法在元素显示在视图上后再做真正的逻辑处理, 保证不会出现错误.

1
2
3
4
5
6
7
/**
  * @desc 可以用于实时循环检测dom上的元素是否存在.
  * @param maxTime (ms)超过此时间如果未满足条件则停止.
  * @param condition 探测停止的条件. 返回true则停止探测.
  * @param stop 停止前会调用一次此方法.
  */
function probeDom(maxTime:Number, condition:()=>boolean, stop:()=>void):void;
← 0基础库