加载中...

1.6.1 dom

概述

包含如下可以更新dom树的dom API。

这部分API是通过把 virtual-dom 的消息发送到native渲染器来做到的。

开发者在日常开发中，唯一可在.we文件中使用的是scrollToElement。
你也可以调用$scrollTo方法来使用它

这个页面提及的其他的API，只在callNative进程中的native渲染器用。
（关于callNative进程的进一步介绍，可以在How it works中的JS Framework部分看到 ）

API

scrollToElement(node, options)

让页面滚动到那个对应的节点，这个API只能在scroller和list组件中用。

这个API也能通过调用VM的方法$scrollTo来使用（已弃用）

要在你的.we文件中使用这个API，可以使用require('@weex-module/dom').scrollToElement。

参数

  • node(Node): 你要滚动到的那个节点
  • options(object): 如下选项
    • offset(number): 一个到其可见位置的偏移距离，默认是0

示例 

var dom = require('@weex-module/dom');
dom.scrollToElement(this.$el('someId'), {offset: 10});

createBody(element)

为整个dom树创建body。
元素（Element）的类型只能是某种能被当做根节点的元素（包括div,scroller,list）

参数

  • element(object): 一个用来指定节点各项信息的对象，包括ref, type, children等。

addElement(parentNode, element, index)

把一个元素加到dom树中

参数

  • parentNode(Node): 指定元素父节点.
  • element(object): 要加到dom树中的这个节点的各项信息.
  • index(number): 插入位置.

removeElement(node)

从dom树中移除节点

参数

  • node(Node): 要被移除的节点

moveElement(node, parentNode, index)

把一个已存在的节点移到另一个节点下面的指定位置（也可以不改变父节点，而只改变指定节点在父节点下面的位置）

参数

  • node(Node): 将要被移动的节点
  • parentNode(Node): 将要移动到的父节点
  • index(number):: 将要被放到的父节点里面的第几个位置。

addEvent(node, type)

通知渲染器有针对某事件（event）的监听器

参数

  • node(Node): 将要被监听的节点
  • type(string): 将要监听的事件类型。

removeEvent(node, type)

移除某节点的某个监听器

参数

  • node(Node): 将要被移除某监听器的节点
  • type(string): 将要被移除的节点类型

updateAttrs(node, attr)

给某个节点更新某个属性

参数

  • node(Node): 要被更新的节点
  • attr(object): 包含所有要被更新的属性。

updateStyle(node, style)

为某个节点改变样式

参数

  • node(Node): 将要被改变的节点
  • style(object): 包含所有要被改变的样式规则。

createFinish()

通知native渲染器，让其更新本已结束的native dom 树

原文：Notify native renders that the series of messages for updating the native dom tree have reached a end.

refreshFinish()

通知native渲染器，让其刷新本已结束native dom 树

原文：Notify native renders that the series of messages for refreshing a native dom tree have reached a end.

还没有评论.