[27/36] incubator-weex git commit: - [doc] remove documents from incubator-weex

[hanks]

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/guide/syntax/display-logic.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/guide/syntax/display-logic.md 
b/doc/source/cn/v-0.10/guide/syntax/display-logic.md
deleted file mode 100644
index 9498de2..0000000
--- a/doc/source/cn/v-0.10/guide/syntax/display-logic.md
+++ /dev/null
@@ -1,252 +0,0 @@
----
-title: 展示逻辑控制
-type: guide
-order: 3.4
-version: 0.10
----
-
-# 展示逻辑控制
-
-Weex 支持通过两种特殊的特性 `if` 和 `repeat` 
确定组件的显示逻辑，这会使得整个界面的展示逻辑控制更åŠ
 ç®€å•çµæ´»ã€‚
-
-## `if`
-
-通过设置 `if` 特性值，你
可以控制当前组件是否显示。如果值为真，则当前组件会被渲染出来，如果值为假则会被移除。例如：
-
-```html
-<template>
-  <div>
-    <text onclick="toggle">Toggle Image</text>
-    <image if="shown" src="{{imageUrl}}" style="width: 512; height: 
512;"></image>
-  </div>
-</template>
-
-<script>
-module.exports = {
-  data: {
-    imageUrl: 
'https://gtms02.alicdn.com/tps/i2/TB1QHKjMXXXXXadXVXX20ySQVXX-512-512.png',
-    shown: true
-  },
-  methods: {
-    toggle: function () {
-      this.shown = !this.shown
-    }
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/e0999a51fa404f48bbae177f1569cd0e)
-
-_注意事项：`if="condition"` 和 `if="{% raw %}{{condition}}{% endraw %}"` 
都是可以的，两者等价使用。_
-
-_注意事项：`if` 不能用在 `<template>` 的根组件上，否则将无
法被 Weex 正常的识别和处理。_
-
-###  `if` 不会阻断子元素的数据更新
-
-下面这个例子在数据更新后 `item` 或 `item.image` 不存在的情
况下会报错：
-
-```html
-<template>
-  <div if="{{(item && item.image)}}" style="width: 200; height: 200;">
-    <image style="width: 100; height: 100;" src="{{item.image.url}}"></image>
-  </div>
-</template>
-```
-
-原因在于 Weex 本身的机制是数据更新在 DOM 更新之前，因此 
`if` 数据更新之后，不支持阻断其子元素的数据更新，即 `if` 
数据更新为 `false` 之后，内部的子元素
仍然会触发自身的数据更新，找不到对应字段，导致报错，可参考这个
 [issue](https://github.com/alibaba/weex/issues/1758)。
-
-因此，有两种解决方案：
-
-- 为 `img` 组件的 `src` 也增加容错方案：
-
-  ```html
-  <div if="{{(item && item.image)}}" style="width: 200; height: 200;">
-    <image style="width: 100; height: 100;" src="{{item && item.image && 
item.image.url}}"></image>
-  </div>
-  ```
-
-- 如果是在 `repeat` 的列表中，还可以使用 
`track-by`强制不复用子元素解决。
-
-## `repeat`
-
-`repeat` 
特性用于重复渲染一组相同的组件。它绑定的数据类型必
须为数组，数组里的每一项数据可以体现在不同的组件特性、æ
 ·å¼ã€äº‹ä»¶ç»‘定等。例如：
-
-``` html
-<template>
-  <div>
-    <div repeat="person in list" class="{{person.gender}}">
-      <text>{{person.nickname}}</text>
-    </div>
-  </div>
-</template>
-
-<style>
-  .male { background-color: #9999ff; }
-  .female { background-color: #ff9999; }
-</style>
-
-<script>
-module.exports = {
-  data: {
-    list: [
-      { gender: 'male', nickname: 'Li Lei' },
-      { gender: 'female', nickname: 'Han Meimei' },
-      { gender: 'male', nickname: 'Jim Green' }
-    ]
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/8c87aac2820531090181c32fca41e913)
-
-此外，`repeat` 
特性还支持绑定数组中数据项目的索引值。例如：
-
-``` html
-<template>
-  <div>
-    <div repeat="(index, person) in list" class="{{person.gender}}">
-      <text>{{index}} - {{person.nickname}}</text>
-    </div>
-  </div>
-</template>
-
-<style>
-  .male { background-color: #9999ff; }
-  .female { background-color: #ff9999; }
-</style>
-
-<script>
-module.exports = {
-  data: {
-    list: [
-      { gender: 'male', nickname: 'Li Lei' },
-      { gender: 'female', nickname: 'Han Meimei' },
-      { gender: 'male', nickname: 'Jim Green' }
-    ]
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/65d348256ab5c54aa996d3ee6b4ea115)
-
-每一个昵称之前都有对应数组项目的索引值。
-
-_注意事项：同样的 `repeat="..."` 和 `repeat="{% raw %}{{...}}{% 
endraw %}"` 都是可以的，两者等价使用。_
-
-_注意事项：`if` 不能用在 `<template>` 的根组件上，否则将无
法被 Weex 正常的识别和处理。_
-
-**注意事项: 当你修改 `repeat` 
中的数组时，在写法上会受到一定的限制，具体如下：**
-
-**直接通过“角标”修改数组的某个项目 (如 `this.items[0] = 
...`) 
是不会触发视图自动更新的。我们在数组的原型上提供了一个额外的方法：`this.items.$set(index,
 item)` 来完成相同的事情。**
-
-```javascript
-// 和 `this.items[0] = ...` 作用相同，但会自动触发视图更新
-this.items.$set(0, { childMsg: 'Changed!'})
-```
-
-**直接通过修改 `length` 来改变数组长度 (如 `this.items.length = 
0`) 
也是不会触发视图自动更新的。我们推荐您直接赋值一个新的空数组把旧的替换掉。**
-
-```javascript
-// 和 `this.items.length = 0` 作用相同，但会自动触发视图更新
-this.items = []
-```
-
-### `repeat` 特性中的 `$index` 形参
-
-在 `repeat` 
特性值中，如果没有指定索引值的形参，则可以通过绑定形参
 `$index` 来展示数组项目的索引值。例如：
-
-``` html
-<template>
-  <div>
-    <div repeat="person in list" class="{{person.gender}}">
-      <text>{{$index}} - {{person.nickname}}</text>
-    </div>
-  </div>
-</template>
-
-<style>
-  .male { background-color: #9999ff; }
-  .female { background-color: #ff9999; }
-</style>
-
-<script>
-module.exports = {
-  data: {
-    list: [
-      { gender: 'male', nickname: 'Li Lei' },
-      { gender: 'female', nickname: 'Han Meimei' },
-      { gender: 'male', nickname: 'Jim Green' }
-    ]
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/65d348256ab5c54aa996d3ee6b4ea115)
-
-渲染效果和上一个例子应该是相同的。
-
-### 在 `repeat` 中使用 `track-by` 特性追踪变化
-
-通常情况下，当更新 `repeat` 
中绑定的数组时，所有数组项目å…
³è”的组件都会被重新渲染。如果å…
¶ä¸­éƒ¨åˆ†ç´¢å¼•å€¼å¯¹åº”的数据未发生变更，那么最好是让这些组件在渲染层保持原æ
 ·ï¼Œä»…更新数据有变化的节点。Weex 提供了 `track-by` 特性来辅
助判断哪些数组项目发生了改变。
-
-首先 `track-by` 特性的值必
须是在每一条数组项目中都有且值没有重复的一个字段名，用来区分和追踪每一条数据项增åˆ
 ä¸Žå¦æˆ–次序变化与否的å…
³é”®ä¾æ®ã€‚每当数组发生变化之后，新老数组数据会根据 
`track-by` 特性值所代表的字段重新匹é…
ï¼Œç„¶åŽå†å†³å®šæ¸²æŸ“层应该新建或删
除一个组件？还是移动一个组件？还是讲组件保持原来的位置。默认的
 `track-by` 的值就是数组的索引值。例如：
-
-``` html
-<template>
-  <div>
-    <div repeat="person in list" class="{{person.gender}}">
-      <text>{{$index}} - {{person.id}} - {{person.nickname}}</text>
-    </div>
-    <text>----</text>
-    <div repeat="person in list" class="{{person.gender}}" track-by="id">
-      <text>{{$index}} - {{person.id}} - {{person.nickname}}</text>
-    </div>
-    <text>----</text>
-    <!-- something wrong here: duplicated track-by value -->
-    <div repeat="person in list" class="{{person.gender}}" track-by="nickname">
-      <text>{{$index}} - {{person.id}} - {{person.nickname}}</text>
-    </div>
-  </div>
-</template>
-
-<style>
-  .male { background-color: #9999ff; }
-  .female { background-color: #ff9999; }
-</style>
-
-<script>
-module.exports = {
-  data: {
-    list: [
-      { id: 11, gender: 'male', nickname: 'Li Lei' },
-      { id: 22, gender: 'female', nickname: 'Han Meimei' },
-      { id: 33, gender: 'male', nickname: 'Jim Green' }
-    ]
-  },
-  ready: function () {
-    this.list.unshift({ id: 44, gender: 'female', nickname: 'Han Meimei' })
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/c124bfc21e6d92271356acbea232089b)
-
-这种情况下，第一个列表的更新策略是：
-
-1. 把第一个 `<text>` 赋值为 `Han Meimei`
-2. 第二个赋值为 `Li Lei`
-3. 第三个赋值为 `Han Meimei`
-4. 最后新建一个 `<text>` 并赋值为 `Jin Green`
-
-第二个列表的更新策略是：
-
-1. 在最前面新建一个 `<text>` 并赋值为 `Han Meimei`
-
-第三个列表的更新会遇到问题，因为有两个数组项目的 
`nickname` 值都是 `Han Meimei` 所以造成意料之外的渲染结果 
(只渲染了三个数组项目)。
-
-下一节：[渲染过程控制](./render-logic.html)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/guide/syntax/events.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/guide/syntax/events.md 
b/doc/source/cn/v-0.10/guide/syntax/events.md
deleted file mode 100644
index 4898219..0000000
--- a/doc/source/cn/v-0.10/guide/syntax/events.md
+++ /dev/null
@@ -1,103 +0,0 @@
----
-title: 事件处理
-type: guide
-order: 3.3
-version: 0.10
----
-
-# 事件处理
-
-Weex 允许对 `<template>` 中的元素绑定事件处理函数。
-
-## 基本语法
-
-以 `on...` 开头的就是用于绑定事件的特性，特性名中 `on` 
之后的部分就是事件的类型，特性的值就是处理该事件的函数名。_函数名外不需要添åŠ
  mustache 语法中的大括号_。例如：
-
-```html
-<template>
-  <div>
-    <text onclick="toggle">Toggle: {{result}}</text>
-  </div>
-</template>
-
-<script>
-  module.exports = {
-    data: {
-      result: true
-    },
-    methods: {
-      toggle: function () {
-        this.result = !this.result
-      }
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/2f9f910a60ffc1ed54c797390d6615e1)
-
-## 内联事件处理参数
-
-同时我们也支持在事件绑定的特性值中内联写明被传å…
¥çš„参数。例如：
-
-```html
-<template>
-  <div>
-    <text onclick="update(1, 2)">Result: {{result}}</text>
-  </div>
-</template>
-
-<script>
-  module.exports = {
-    data: {
-      result: '<empty>'
-    },
-    methods: {
-      update: function (x, y) {
-        this.result = x + y
-      }
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/777056d8985e73567464e2d66cbe73fc)
-
-## 特殊的内联事件处理参数
-
-额外的，在这种内联的事件绑定写法中，你
可以使用一个特殊的参数 
`$event`，代表事件描述对象，即默认事件处理函数的第一个参数。所以
 `<template>` 中的 `onclick="foo"` 和 `onclick="foo($event)"` 
是等价的，`$event` 的用法可以更多参考下面的例子
-
-```html
-<template>
-  <div>
-    <text onclick="update($event, 1, 2)">Result: {{result}}</text>
-  </div>
-</template>
-
-<script>
-  module.exports = {
-    data: {
-      result: '<empty>'
-    },
-    methods: {
-      update: function (e, x, y) {
-        this.result = e.type + (x + y)
-      }
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/5e1e7c22f036725e44c3ff492f173400)
-
-## 事件描述对象
-
-每当一次事件被触发的时候，都会产生一个事件描述对象，该对象会默认作为第一个参数ä¼
 é€’给事件处理函数，或以 `$event` 形参的方式出现在内
联事件处理函数中。
-
-每个事件描述对象至少包含以下几个特性：
-
-- `type` (`string`): 事件名称, 如: `click`
-- `target` (`Element`): 目标元素
-- `timestamp` (`number`): 事件触发时的时间戳数字
-
-下一节：[展示逻辑控制](./display-logic.html)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/guide/syntax/id.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/guide/syntax/id.md 
b/doc/source/cn/v-0.10/guide/syntax/id.md
deleted file mode 100644
index 0a204ad..0000000
--- a/doc/source/cn/v-0.10/guide/syntax/id.md
+++ /dev/null
@@ -1,124 +0,0 @@
----
-title: 找节点
-type: guide
-order: 3.7
-version: 0.10
----
-
-# 找节点
-
-在 Weex 中，您可以通过在特定的子组件上设置 `id` 
特性，以此在该 `<template>` 内唯一标识这个组件。
-
-## 获取子组件
-
-您可以在父组件上下文中使用 `this.$el(id)` 
来找到该组件，以运用 `scrollToElement()` 为例：
-
-```html
-<template>
-  <div>
-    <text id="goto-top">Top</text>
-    <div style="height: 10000; background-color: #999999;"></div>
-    <text onclick="back2Top">Back to Top</text>
-  </div>
-</template>
-<script>
-  var dom = require('@weex-module/dom')
-  module.exports = {
-    methods: {
-      back2Top: function () {
-        var el = this.$el('goto-top')
-        dom.scrollToElement(el, { offset: 10 })
-      }
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/ed07068ef6f038d6c39af6c971ad08a0)
-
-### `id` 和 `repeat` 特性配合使用
-
-`id` 也可以和 `repeat` 语法配合使用，关于 `repeat` 更多详见 
[展示逻辑控制](./display-logic.html)，但是要确保循环的节点需要用不同的
 `id`，比如：
-
-```html
-<template>
-  <div>
-    <image
-      repeat="image in images"
-      id="img-{{image.id}}"
-      src="{{image.url}}"
-      onclick="getImageId"></image>
-  </div>
-</template>
-<script>
-module.exports = {
-  data: {
-    images: [
-      {id: 1, url: '...'},
-      {id: 2, url: '...'},
-      {id: 3, url: '...'},
-      ...
-    ]
-  },
-  methods: {
-    getImageId: function(e) {
-      // get e.target.id
-    }
-  }
-}
-</script>
-```
-
-### 获取自定义子组件的上下文
-
-另外，我们还可以通过 `this.$vm(id)` 
方法可以访问自定义子组件的上下文：
-
-```html
-<element name="foo">
-  <template>
-    <div style="flex-direction: row;">
-      <text>{{title}}</text>
-    </div>
-  </template>
-  <script>
-    module.exports = {
-      data: {
-        title: null
-      },
-      methods: {
-        setTitle: function (text) {
-          this.title = text
-        }
-      }
-    }
-  </script>
-</element>
-
-<template>
-  <div>
-    <foo id="sub" title="Hello"></foo>
-    <text onclick="update">Click Me to Update</text>
-  </div>
-</template>
-<script>
-  module.exports = {
-    methods: {
-      update: function (e) {
-        this.$vm('sub').setTitle('Updated')
-      }
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/1d332e6c238462e841743035c6bc697e)
-
-实际
上，如上述的例子，我们找到子组件上下文之后，直接在这个上下文中调用子组件方法或修改子组件的数据并不是我们认为最好的方式，我们更倾向于通过一套确定的组件间通信机制来完成这一工作。
-
-### 获取父级组件或其上下文
-
-除了可以自上而下寻找组件或其上下文，Weex 
也支持自下而上做相同的事情。当前上下文中的 `this._parent` 
可以获取å…
¶çˆ¶çº§ä¸Šä¸‹æ–‡ã€‚除了父级上下文，对于父级组件本身，相å…
³å¤„理也可以基于先获取父级上下文，然后在父级组件内
部完成更多更细致的处理。更多内容可以深å…
¥äº†è§£ç»„件间通信的部分。
-
-_注意事项：在未来的版本中 `this._parent` 将改为 
`this.$parent`。_
-
-下一篇： [组件间通信](./comm.html)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/guide/syntax/index.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/guide/syntax/index.md 
b/doc/source/cn/v-0.10/guide/syntax/index.md
deleted file mode 100644
index df0c33a..0000000
--- a/doc/source/cn/v-0.10/guide/syntax/index.md
+++ /dev/null
@@ -1,134 +0,0 @@
----
-title: 语法介绍
-type: guide
-order: 3
-has_chapter_content: true
-version: 0.10
----
-
-# 语法综述
-
-Weex 代码由 `<template>`、`<style>`、`<script>` 三个部分构成。
-
-- `<template>`：_必须的_，使用 HTML 语法描述页面结构，内
容由多个标签组成，不同的标签代表不同的组件。
-- `<style>`：_可选的_，使用 CSS 语法描述页面的å…
·ä½“展现形式。
-- `<script>`：_可选的_，使用 JavaScript 
描述页面中的数据和页面的行为，Weex 中的数据定义也在 
`<script>` 中进行。
-
-```html
-<template>
-  <!-- (required) the structure of page -->
-</template>
-
-<style>
-  /* (optional) stylesheet */
-</style>
-
-<script>
-  /* (optional) the definition of data, methods and life-circle */
-</script>
-```
-
-这是一个典型的 M-V-VM 架构：通过 ViewModel 把 Model 和 View 
建立更直接有效的关系，ViewModel 的实现以 `<script>` 的内
容为主。
-
-## `<template>` 模板
-
-`<template>` 中的标签组织类似如下代码：
-
-``` html
-<template>
-  <div>
-    <image style="width: 200; height: 200;" 
src="https://gtms02.alicdn.com/tps/i2/TB1QHKjMXXXXXadXVXX20ySQVXX-512-512.png";></image>
-    <text>Alibaba Weex Team</text>
-  </div>
-</template>
-```
-
-[体验一下](http://dotwe.org/5256e6e610ded330369f2e8010f7f0e6)
-
-`<div>` 标签是一个根节点，里面包含描述图片的 `<image>` æ 
‡ç­¾å’Œæè¿°æ–‡å­—çš„ `<text>` 标签。
-
-和 HTML 类似，不同标签代表的组件有各自的特性 
(attribute)，部分组件可以拥有自己的子组件。
-
-延伸阅读：[内置组件列表](../../references/components/index.html)
-
-根节点：每个 Weex 页面最顶层的节点，我们称为æ 
¹èŠ‚点。下面是目前我们支持的三种根节点：
-
-- `<div>`：普通根节点，有确定的尺寸，不可滚动。
-- `<scroller>`：可滚动根节点，适用于需要全页滚动的场景。
-- `<list>`：列表根节点，适用于其中包含重复的子元素
的列表场景。
-
-目前 Weex 仅支持以上三种根节点。
-
-_注意事项：`<template>` 只支持一个根节点，多个根节点将无
法被 Weex 正常的识别和处理。_
-
-## `<style>` 样式
-
-我们可以把 Weex 中的样式语法理解为 CSS 的一个子集，两者
有一些细微的区别
-
-第一种写法是，你能在标签上，直接通过内联 `style` 
特性编写样式. 第二种写法，通过标签中的 `class` 特性与 
`<style>` 标签中定义的样式建立对应关系，让 `<style>` æ 
‡ç­¾ä¸­å®šä¹‰çš„样式作用于特定标签之上。以下是例子：
-
-```html
-<template>
-  <div>
-    <text style="font-size: 64;">Alibaba</text>
-    <text class="large">Weex Team</text>
-  </div>
-</template>
-
-<style>
-  .large {font-size: 64;}
-</style>
-```
-
-[体验一下](http://dotwe.org/d8af9186bf045df74e7a538d91798db4)
-
-上面的两个 `<text>` 组件都被设置了同æ 
·çš„字体大小，但分别用了两种不同的方式。
-
-延伸阅读：[Weex 通用样式](../references/common-style.html)
-
-**注意**：Weex 遵循 [HTML 
特性](https://en.wikipedia.org/wiki/HTML_attribute) 
命名规范，所以特性命名时**请不要使用陀峰格式 
(CamelCase)**，采用以“-”分割的 **long-name** 形式。
-
-## `<script>` 脚本
-
-`<script>` 描述页面中的数据和页面的行为，代码遵循 
JavaScript (ES5) 语法 (目前 iOS 端和浏览器端取决于内置 
JavaScript 引擎对 ES 版本的支持情况，安卓端能够完整支持 
ES5，但不原生支持 ES6，需要用类似 [babel](http://babeljs.io) 
的工具对源代码进行转换)。下面是一个例子：
-
-``` html
-<template>
-  <div>
-    <text>The time is {{datetime}}</text>
-    <text>{{title}}</text>
-    <text>{{getTitle()}}</text>
-  </div>
-</template>
-
-<script>
-  module.exports = {
-    data: {
-      title: 'Alibaba',
-      datetime: null
-    },
-    methods: {
-      getTitle: function () {
-        return 'Weex Team'
-      }
-    },
-    created: function() {
-      this.datetime = new Date().toLocaleString()
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/8095bed0d9db4299fb39975d4b35b13f)
-
-上面 `<script>` 标签中定义了被赋值给 `module.exports` 
的对象，这个对象其实就是一个 ViewModel 选项，让三个 
`<text>` 标签显示当前时间、“Alibaba”字样和“Weex Team”字æ 
·ã€‚
-
-选项中的 `data` 
用于存储数据，这些数据可以通过[数据绑定](./data-binding.html)机制和
 `<template>` 标签中的内
容绑定起来。当这些数据变更时，被绑定的模板内
容也会自动更新。这些数据在 `<script>` 
中的各个方法中可以通过类似 `this.x` 的方式进行读写操作。
-
-而选项中的 `methods` 
里则列出了当前上下文可执行的各种函数，比如 `getTitle()`。
-
-选项中最后的 `created` 
是生命周期函数，会在数据初始化之后、界面被绑定数据并渲染之前执行。类似的生命周期函数还有
 `init`、`ready` 等，在这个例子中，`datetime` 
会在界面渲染之前被更新为当前的时间。
-
-延伸阅读：[ViewModel 选项](../../references/component-defs.html)
-
-接下来，我们来详细介绍[数据绑定](./data-binding.html)的相å…
³çŸ¥è¯†ã€‚

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/guide/syntax/render-logic.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/guide/syntax/render-logic.md 
b/doc/source/cn/v-0.10/guide/syntax/render-logic.md
deleted file mode 100644
index f516733..0000000
--- a/doc/source/cn/v-0.10/guide/syntax/render-logic.md
+++ /dev/null
@@ -1,44 +0,0 @@
----
-title: 渲染过程控制
-type: guide
-order: 3.5
-version: 0.10
----
-
-# 渲染过程控制
-
-## `append`
-
-`append` 特性定义了当前组件的子组件：
-
-1. 以一整棵树的方式一次性添加到视图中 
(`append="tree"`)，还是
-2. 每个子组件都产生一次单独的添加到视图的指令 
(`append="node"`)
-
-``` html
-<template>
-  <div>
-    <div>
-      <text>Hello</text>
-      <text>Weex</text>
-    </div>
-    <div append="node">
-      <text>Hello</text>
-      <text>Weex</text>
-    </div>
-    <div append="tree">
-      <text>Hello</text>
-      <text>Weex</text>
-    </div>
-  </div>
-</template>
-```
-
-[体验一下](http://dotwe.org/417c75415efce66d8e22bf5942b380ee)
-
-在上面的代码中，第一组和第二组 `<div>` 
的渲染过程相同，即先添加空的父级 `<div>`，然后插å…
¥ç¬¬ä¸€ä¸ª `<text>` Hello，然后插入第二个 `<text>` Weex；第三组 
`<div>` 则是连带两个 `<text>` 子组件一齐传
给渲染层进行渲染的。
-
-渲染结果显而易见，前两组渲染方式会使首次绘制的响应速度比后è€
…快些，但是总渲染时间可能比第三组 `append="tree"` 
更长。开发者可以根据实际界面的情
况自行选择合理的渲染过程。
-
-默认情况下，除了 `<cell>` 组件的默认渲染过程是 `tree` 
模式，其它组件都默认按照 `node` 模式进行渲染。
-
-下一节：[自定义组件](./composed-component.html)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/guide/syntax/style-n-class.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/guide/syntax/style-n-class.md 
b/doc/source/cn/v-0.10/guide/syntax/style-n-class.md
deleted file mode 100644
index afe2de1..0000000
--- a/doc/source/cn/v-0.10/guide/syntax/style-n-class.md
+++ /dev/null
@@ -1,117 +0,0 @@
----
-title: CSS 样式和类
-type: guide
-order: 3.2
-version: 0.10
----
-
-# CSS 样式和类
-
-## 基础语法
-
-CSS 样式可以理解为一系列的键值对，å…
¶ä¸­çš„每一对描述了一个特定的样式，例如组件的宽或者高。
-
-```css
-.div {
-  width: 400; 
-  height: 50;
-}
-```
-
-键值对的形式是 `prop-name: prop-value;`。键名是 
`prop-name`，键值是 `prop-value`。 一般情况下，键名按ç…
§è¿žæŽ¥ç¬¦çš„方式进行命名，键和值之间由冒号 `:` 
进行分隔，每对键值之间由分号 `;` 进行分隔。
-
-在 Weex 页面上样式有两种形式：
-
-- `<template>` 中的 `style` 特性
-- `<style>` 样式表
-
-### `<template>` 中的 `style` 特性
-
-在 `style` 特性中编写样式，例如：
-
-```html
-<template>
-  <div style="width: 400; height: 50;">
-    ...
-  </div>
-</template>
-```
-
-这段代码的意思是 `<div>` 组件的宽和高分别为 400 像素和 50 
像素。
-
-### `<style>` 样式表
-
-例如:
-
-```html
-<style>
-  .wrapper { width: 600; }
-  .title { width: 400; height: 50; }
-  .highlight { color: #ff0000; }
-</style>
-```
-
-样式表包含了多个æ 
·å¼è§„则，每条规则有一个对应的类，以及由 `{...}` 包
括的若干条样式。例如：
-
-```css
-.title { width: 400; height: 50; }
-```
-
-### `class` 特性
-
-`<template>` 标签中的 `class` 特性值用来匹配 `<style>` æ 
·å¼è¡¨ä¸­çš„一个或多个 class 名，多个 class name 之间由空æ 
¼åˆ†éš”。例如：
-
-```html
-<template>
-  <div class="wrapper">
-    <text class="title">...</text>
-    <text class="title highlight">...</text>
-  </div>
-</template>
-<style>
-  .wrapper { width: 600; }
-  .title { width: 400; height: 50; }
-  .highlight { color: #ff0000; }
-</style>
-```
-
-[体验一下](http://dotwe.org/8487e2a33cd051c9adfa887d0bafbb44)
-
-这段代码的含义是 `<div>` 组件的宽度是 600 像素，两个 
`<text>` 组件的尺寸为 400x50，其中第二个文本组件是红色字。
-
-**注意事项**
-
-- 为了简化页面设计和实现，屏幕的宽度统一为 750 像素
，不同设备屏幕都会按ç…
§æ¯”例转化为这一尺寸进行长度计算。
-- 标准 CSS 支持很多样式选择器，但 Weex 目前只支持单个 
class name 的选择器。
-- 标准 CSS 支持很多的长度单位，但 Weex 目前只支持像素
，并且 `px` 
单位可以忽略不写，直接使用对应的数值。更多详情
请查看[通用样式](../references/common-style.html)。
-- 子元素的样式不会继承自父元素，这一点与标准 CSS 
不同，比如 `color` 和 `font-size` 等样式作用在 `<text>` 上层的 
`<div>` 上是无效的。
-- 标准 CSS 包含了非常多的样式属性，但 Weex 只支持了å…
¶ä¸­çš„一部分，比如盒模型、flexbox、position 
等布局属性，以及 `font-size`、`color` 等其它样式。
-
-## 与数据绑定结合
-
-请查阅[数据绑定](./data-binding.html)中有关 `style` 和 `class` 
特性的相关部分。这里简单举个例子：
-
-```html
-<template>
-  <div>
-    <text style="font-size: {{fontSize}};">Alibaba</text>
-    <text class="large {{textClass}}">Weex Team</text>
-  </div>
-</template>
-<style>
-  .large {font-size: 32;}
-  .highlight {color: #ff0000;}
-</style>
-<script>
-  module.exports = {
-    data: {
-      fontSize: 32,
-      textClass: 'highlight'
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/440d3318dc7b83e3bb0a110f3b3236ca)
-
-下一篇：[事件处理](./events.html)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/index.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/index.md b/doc/source/cn/v-0.10/index.md
deleted file mode 100644
index 9e59b8c..0000000
--- a/doc/source/cn/v-0.10/index.md
+++ /dev/null
@@ -1,5 +0,0 @@
-layout: index
-type: index
-subtitle: 快速、简洁且高效
-version: 0.10
----
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/api.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/api.md 
b/doc/source/cn/v-0.10/references/api.md
deleted file mode 100644
index e3e5e4b..0000000
--- a/doc/source/cn/v-0.10/references/api.md
+++ /dev/null
@@ -1,67 +0,0 @@
----
-title: ViewModel APIs
-type: references
-order: 1.3
-version: 0.10
----
-
-# 接口
-
-你可以在组件的方法中通过 `this` （Vm）上下文访问这些 
API。
-
-例子：
-
-```html
-<script>
-module.exports = {
-  methods: {
-    somemethod: function() {
-      this.$vm('someId');
-    }
-  }
-}
-</script>
-```
-
-## $(id)
-
-**不建议使用**，请使用 `$vm` 代替。
-## $el(id)
-
-返回对应 id 的元素对象的引用。
-### Arguments
-- `id` _(string)_: 唯一标识符。
-### Returns
-- _(Element)_: 一个元素对象的引用。
-### Tips
-- id 只能保证是当前（页面）组件中是唯一的，如果你
需要寻找父组件或子组件，你
可以利用组件间的通信模式实现。
-- 延伸阅读： [id](../guide/syntax/id.md)，[Communicate Between 
Components](../guide/syntax/comm.md)
-## $vm(id)
-
-返回对应 id 的 vm 对象引用。
-### Arguments
-- `id` _(String)_: 唯一标识符。
-### Returns
-- `vm` _(Vm)_: 一个 Vm 对象引用。
-### Tips
-- id 只能保证是当前（页面）组件中是唯一的，如果你
需要寻找父组件或子组件，你
可以利用组件间的通信模式实现。
-- 延伸阅读： [id](../guide/syntax/id.md)，[Communicate Between 
Components](../guide/syntax/comm.md)
-## $getConfig()
-
-获取当前全局环境变量和配置信息。
-### Returns
-- `config` _(object)_: 配置对象；
-- `bundleUrl` _(string)_: bundle 的 url；
-- `debug` _(boolean)_: 是否是调试模式；
-- `env` _(object)_: 环境对象；
-  - `weexVersion` _(string)_: Weex sdk 版本；
-  - `appName` _(string)_: 应用名字；
-  - `appVersion` _(string)_: 应用版本；
-  - `platform` _(string)_: 平台信息，是 `iOS`、`Android` 还是 `Web`；
-  - `osVersion` _(string)_: 系统版本；
-  - `deviceModel` _(string)_: 设备型号 **（仅原生应用）**；
-  - `deviceWidth` _(number)_: 设备宽度，默认为 `750`；
-  - `deviceHeight` _(number)_: 设备高度。
-## $call(module, method, ...args)
-
-**不建议使用**，请使用 
`require('@weex-module/module')[method](...args)` 
代替。查看更多信息：[modules](./modules/main)。

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/bubble.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/bubble.md 
b/doc/source/cn/v-0.10/references/bubble.md
deleted file mode 100644
index 74b7e98..0000000
--- a/doc/source/cn/v-0.10/references/bubble.md
+++ /dev/null
@@ -1,150 +0,0 @@
----
-title: 事件冒泡 
-type: references
-order: 1.3
-version: 0.10
----
-
-# 事件冒泡 <span class="api-version">v0.13+</span>
-
-Weex 1.0 实现了 W3C 标准的事件冒泡机制。
-
-### 使用
-
-```html
-<template>
-  <div class="root" onclick="rootClick" bubble="true">
-    <div>
-      <text style="font-size: 40px;">{{rootText}}</text>
-    </div>
-    <div class="outer" onclick="parentClick">
-      <div>
-        <text style="font-size: 40px;">{{parentText}}</text>
-      </div>
-      <text class="inner" onclick="click">{{innerText}}</text>
-    </div>
-  </div>
-</template>
-
-<script>
-  module.exports = {
-    data: {
-      innerText: 'click me',
-      parentText: '',
-      rootText: ''
-    },
-    methods: {
-      click: function(e) {
-        this.innerText = 'inner bubble'
-      },
-      parentClick: function(e) {
-        this.parentText = 'parent bubble'
-      },
-      rootClick: function(e) {
-        this.rootText = 'root bubble'
-      }
-    }
-  }
-</script>
-
-<style>
-  .inner {
-    font-size: 40px;
-    text-align: center;
-    background-color: #7a9b1b;
-    padding: 40px;
-  }
-
-  .outer {
-    font-size: 40px;
-    text-align: center;
-    background-color: #9b7a1b;
-    padding: 120px;
-  }
-
-  .root {
-    font-size: 40px;
-    text-align: center;
-    background-color: #7a1b9b;
-    padding: 80px;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/weex/dbfeb926e003986e2eea88c8ccdadb92)
-
-运行以上代码，用客户端打开，点击中间的元素
，可以看到事件向上传播，依次触发。
-
-### 注意
-
-需要注意的是: ** 为了兼容之前的版本，Weex 
默认不会开启事件冒泡机制。需要在根元素的属性上，添加 
`bubble="true"` 来开启冒泡机制。否则，将不会向上传
播事件，保持与之前版本的效果相同。 **
-
-### stopPropagation
-
-在事件处理函数中，可以使用 `e.stopPropagation()` 
方法，来阻止本次事件向上的传
递过程。注意，`e.stopPropagation()` 与 `bubble="true"` 不同，前者
只会影响当前元素以及父元素的传播，不会影响子元素的传
播；后者是为了版本兼容而增加的开关机制，会全局å…
³é—­æˆ–者开启冒泡机制，两者可以共同存在使用，如下：
-
-```html
-<template>
-  <div class="root" onclick="rootClick" bubble="true">
-    <div>
-      <text style="font-size: 40px;">{{rootText}}</text>
-    </div>
-    <div class="outer" onclick="parentClick">
-      <div>
-        <text style="font-size: 40px;">{{parentText}}</text>
-      </div>
-      <text class="inner" onclick="click">{{innerText}}</text>
-    </div>
-  </div>
-</template>
-
-<script>
-  module.exports = {
-    data: {
-      innerText: 'click me',
-      parentText: '',
-      rootText: ''
-    },
-    methods: {
-      click: function(e) {
-        this.innerText = 'inner bubble'
-      },
-      parentClick: function(e) {
-        this.parentText = 'parent bubble'
-        e.stopPropagation()
-      },
-      rootClick: function(e) {
-        this.rootText = 'root bubble'
-        // e.stopPropagation()
-      }
-    }
-  }
-</script>
-
-<style>
-  .inner {
-    font-size: 40px;
-    text-align: center;
-    background-color: #7a9b1b;
-    padding: 40px;
-  }
-
-  .outer {
-    font-size: 40px;
-    text-align: center;
-    background-color: #9b7a1b;
-    padding: 120px;
-  }
-
-  .root {
-    font-size: 40px;
-    text-align: center;
-    background-color: #7a1b9b;
-    padding: 80px;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/weex/0cab45a7c62e8bebedd2ffd83a8e1256)
-
-运行以上代码，用客户端打开，点击中间的元素
，可以看到事件向上传播到父元素被终止，不再继续往根å…
ƒç´ ä¼ æ’­ã€‚

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/cheatsheet.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/cheatsheet.md 
b/doc/source/cn/v-0.10/references/cheatsheet.md
deleted file mode 100644
index 777abf6..0000000
--- a/doc/source/cn/v-0.10/references/cheatsheet.md
+++ /dev/null
@@ -1,114 +0,0 @@
----
-title: Weex 快查手册
-type: references
-order: 6
-version: 0.10
----
-
-# Weex 备忘录
-
-## Native 组件
-<style>
-code {
-  word-break: break-all;
-}
-</style>
-
-| 组件 | 特性 | 样式 | 事件 | 特殊父组件 | 子组件 |
-| ---- | ---- | ---- | ---- | ---- | ---- |
-| `<div>` | - | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear` | - | (any) |
-| `<text>` | `value` | **box 
model**<br>flex<br>`position`<br>`background-color`<br>`opacity`<br>`color`<br>`font-size`<br>`font-style`<br>`font-weight`<br>`text-decoration`<br>`text-align`<br>`text-overflow`<br>`line-height`
 | `click`<br>`appear`<br>`disappear` | - | text only |
-| `<image>` | `src` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity`<br>`resize`
 | `click`<br>`appear`<br>`disappear` | - | (none) |
-| `<scroller>` | `show-scrollbar`<br>`scroll-direction` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear` | - | (any) |
-| `<list>` | `loadmoreoffset` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear`<br>`loadmore`<br>`refresh`<br>`loading` | - 
| `<cell>`<br>`<header>`<br>`<refresh>`<br>`<loading>` |
-| `<cell>` | - | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear` | `<list>` | (any) |
-| `<slider>` | `auto-play` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear`<br>`change` | - | (any)<br>`<indicator>` |
-| `<indicator>` | - | **box 
model**<br>**flexbox**<br>`position`<br>`item-color`<br>`item-selected-color`<br>`item-size`
 | `click`<br>`appear`<br>`disappear` | `<slider>` | (none) |
-| `<wxc-navpage>` | 
`height`<br>`background-color`<br>`title`<br>`title-color`<br>`left-item-title`<br>`left-item-color`<br>`right-item-title`<br>`right-item-color`<br>`left-item-src`<br>`right-item-src`
 | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear`<br>`naviBar.leftItem.click`<br>`naviBar.rightItem.click`
 | - | (any) |
-| `<wxc-tabbar>` | `tab-items` |  **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`tabBar.onClick` | - | (none) |
-| `<embed>` | `src` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear` | - | (none) |
-| `<web>` | `src` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear`<br>`pagestart`<br>`pagefinish`<br>`error` | 
- | (none) |
-| `<video>` | `src`<br>`play-status`<br>`auto-play` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear`<br>`start`<br>`pause`<br>`finish`<br>`fail` 
| - | (none) |
-| `<a>` | `href` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`click`<br>`appear`<br>`disappear` | - | (any) |
-| `<input>` | `type`<br>`value`<br>`placeholder`<br>`disabled`<br>`autofocus` 
| **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity`<br>`placeholder-color`<br>`color`<br>`font-size`<br>`font-style`<br>`font-weight`<br>`text-align`
 | `click`<br>`appear`<br>`disappear` | - | (none) |
-| `<switch>` | `checked` | **box 
model**<br>**flexbox**<br>`position`<br>`background-color`<br>`opacity` | 
`appear`<br>`disappear`<br>`input`<br>`change`<br>`focus`<br>`blur` | - | 
(none) |
-
-## Native Modules
-
-| module | apis |
-| ---- | ---- |
-| `@weex-module/dom` | `scrollToElement(node, { offset })` |
-| `@weex-module/modal` | `toast({ message, duration })`<br>`alert({ message, 
okTitle }, callback)`<br>`confirm({ message, okTitle, cancelTitle }, 
callback(result))`<br>`prompt({ message, okTitle, cancelTitle }, 
callback(result, data))` |
-| `@weex-module/stream` | `fetch({ method, url, headers, type, body }, 
callback({ status, ok, statusText, data, headers }), progressCallback({ 
readyState, status, length, statusText, headers}))` |
-| `@weex-module/webview` | `goBack(ref)`<br>`goForward(ref)`<br>`reload(ref)` |
-| `@weex-module/navigator` | `push({ url, animated }, callback)`<br>`pop({ 
animated }, callback)` |
-| `@weex-module/animation` | `transition(node, { styles, duration, 
timingFunction, delay, transform-origin }, callback)` |
-
-## 特殊的模版语法
-
-* `<foo x="abc">`
-* `{% raw %}<foo x="{{expr}}">{% endraw %}`
-* `<foo style="name1: value1; name2: value2">`
-* `{% raw %}<foo style="name1: value1; name2: {{expr}}; name3: ...">{% endraw 
%}`
-* `<foo class="a b c">`
-* `{% raw %}<foo class="a {{expr}} c">{% endraw %}`
-* `<foo onclick="methodName">`
-* `<foo id="abc">`
-* `<foo if="expr">`
-* `<foo repeat="item in list">`
-* `<foo repeat="(key,item) in list">`
-* `<component type="foo">`
-* `{% raw %}<component type="{{expr}}">{% endraw %}`
-
-## ViewModel APIs
-
-* `this.$vm(el)`
-* `this.$el(el)`
-* `this.$getConfig()`
-* `this.$emit(type, data)`
-* `this.$dispatch(type, data)`
-* `this.$broadcast(type, data)`
-
-## ViewModel Options
-
-* `data`
-* `methods`
-* `computed`
-* `init`, `created`, `ready`
-* `events`
-
-**示例：**
-
-```javascript
-module.exports = {
-
-  data: function () {
-    return {
-      x: 1,
-      y: 2
-    }
-  }
-
-  methods: {
-    foo: function () {
-      console.log('foo')
-    }
-  },
-
-  computed: {
-    z: function () {
-      return this.x + this.y
-    }
-  },
-
-  events: {
-    custom: function (e) {
-      console.log(e)
-    }
-  },
-
-  init: function () {},
-  created: function () {},
-  ready: function () {}
-}
-```

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/color-names.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/color-names.md 
b/doc/source/cn/v-0.10/references/color-names.md
deleted file mode 100644
index 1b8a968..0000000
--- a/doc/source/cn/v-0.10/references/color-names.md
+++ /dev/null
@@ -1,180 +0,0 @@
----
-title: 颜色名称列表
-type: references
-order: 1.8
-version: 0.10
----
-
-# Weex 支持的所有颜色名称
-
-### 基础颜色关键词:
-
-| 颜色名 | 十六进制RGB值 |
-| --- | --- |
-| black(黑) | #000000 |
-| silver(银) | #C0C0C0 |
-| gray(灰) | #808080 |
-| white(白) | #FFFFFF |
-| maroon(褐紫红) | #800000 |
-| red(红) | #FF0000 |
-| purple(ç´«) | #800080 |
-| fuchsia(晚樱) | #FF00FF |
-| green(绿) | #008000 |
-| lime(石灰) | #00FF00 |
-| olive(橄榄) | #808000 |
-| yellow(黄) | #FFFF00 |
-| navy(海军蓝) | #000080 |
-| blue(蓝) | #0000FF |
-| teal(水鸭) | #008080 |
-| aqua(水蓝) | #00FFFF |
-### 扩展颜色关键词:
-
-| 颜色名 | 十六进制RGB值 |
-| --- | --- |
-| aliceblue | #F0F8FF |
-| antiquewhite | #FAEBD7 |
-| aqua | #00FFFF |
-| aquamarine | #7FFFD4 |
-| azure | #F0FFFF |
-| beige | #F5F5DC |
-| bisque | #FFE4C4 |
-| black | #000000 |
-| blanchedalmond | #FFEBCD |
-| blue | #0000FF |
-| blueviolet | #8A2BE2 |
-| brown | #A52A2A |
-| burlywood | #DEB887 |
-| cadetblue | #5F9EA0 |
-| chartreuse | #7FFF00 |
-| chocolate | #D2691E |
-| coral | #FF7F50 |
-| cornflowerblue | #6495ED |
-| cornsilk | #FFF8DC |
-| crimson | #DC143C |
-| cyan | #00FFFF |
-| darkblue | #00008B |
-| darkcyan | #008B8B |
-| darkgoldenrod | #B8860B |
-| darkgray | #A9A9A9 |
-| darkgreen | #006400 |
-| darkgrey | #A9A9A9 |
-| darkkhaki | #BDB76B |
-| darkmagenta | #8B008B |
-| darkolivegreen | #556B2F |
-| darkorange | #FF8C00 |
-| darkorchid | #9932CC |
-| darkred | #8B0000 |
-| darksalmon | #E9967A |
-| darkseagreen | #8FBC8F |
-| darkslateblue | #483D8B |
-| darkslategray | #2F4F4F |
-| darkslategrey | #2F4F4F |
-| darkturquoise | #00CED1 |
-| darkviolet | #9400D3 |
-| deeppink | #FF1493 |
-| deepskyblue | #00BFFF |
-| dimgray | #696969 |
-| dimgrey | #696969 |
-| dodgerblue | #1E90FF |
-| firebrick | #B22222 |
-| floralwhite | #FFFAF0 |
-| forestgreen | #228B22 |
-| fuchsia | #FF00FF |
-| gainsboro | #DCDCDC |
-| ghostwhite | #F8F8FF |
-| gold | #FFD700 |
-| goldenrod | #DAA520 |
-| gray | #808080 |
-| green | #008000 |
-| greenyellow | #ADFF2F |
-| grey | #808080 |
-| honeydew | #F0FFF0 |
-| hotpink | #FF69B4 |
-| indianred | #CD5C5C |
-| indigo | #4B0082 |
-| ivory | #FFFFF0 |
-| khaki | #F0E68C |
-| lavender | #E6E6FA |
-| lavenderblush | #FFF0F5 |
-| lawngreen | #7CFC00 |
-| lemonchiffon | #FFFACD |
-| lightblue | #ADD8E6 |
-| lightcoral | #F08080 |
-| lightcyan | #E0FFFF |
-| lightgoldenrodyellow | #FAFAD2 |
-| lightgray | #D3D3D3 |
-| lightgreen | #90EE90 |
-| lightgrey | #D3D3D3 |
-| lightpink | #FFB6C1 |
-| lightsalmon | #FFA07A |
-| lightseagreen | #20B2AA |
-| lightskyblue | #87CEFA |
-| lightslategray | #778899 |
-| lightslategrey | #778899 |
-| lightsteelblue | #B0C4DE |
-| lightyellow | #FFFFE0 |
-| lime | #00FF00 |
-| limegreen | #32CD32 |
-| linen | #FAF0E6 |
-| magenta | #FF00FF |
-| maroon | #800000 |
-| mediumaquamarine | #66CDAA |
-| mediumblue | #0000CD |
-| mediumorchid | #BA55D3 |
-| mediumpurple | #9370DB |
-| mediumseagreen | #3CB371 |
-| mediumslateblue | #7B68EE |
-| mediumspringgreen | #00FA9A |
-| mediumturquoise | #48D1CC |
-| mediumvioletred | #C71585 |
-| midnightblue | #191970 |
-| mintcream | #F5FFFA |
-| mistyrose | #FFE4E1 |
-| moccasin | #FFE4B5 |
-| navajowhite | #FFDEAD |
-| navy | #000080 |
-| oldlace | #FDF5E6 |
-| olive | #808000 |
-| olivedrab | #6B8E23 |
-| orange | #FFA500 |
-| orangered | #FF4500 |
-| orchid | #DA70D6 |
-| palegoldenrod | #EEE8AA |
-| palegreen | #98FB98 |
-| paleturquoise | #AFEEEE |
-| palevioletred | #DB7093 |
-| papayawhip | #FFEFD5 |
-| peachpuff | #FFDAB9 |
-| peru | #CD853F |
-| pink | #FFC0CB |
-| plum | #DDA0DD |
-| powderblue | #B0E0E6 |
-| purple | #800080 |
-| red | #FF0000 |
-| rosybrown | #BC8F8F |
-| royalblue | #4169E1 |
-| saddlebrown | #8B4513 |
-| salmon | #FA8072 |
-| sandybrown | #F4A460 |
-| seagreen | #2E8B57 |
-| seashell | #FFF5EE |
-| sienna | #A0522D |
-| silver | #C0C0C0 |
-| skyblue | #87CEEB |
-| slateblue | #6A5ACD |
-| slategray | #708090 |
-| slategrey | #708090 |
-| snow | #FFFAFA |
-| springgreen | #00FF7F |
-| steelblue | #4682B4 |
-| tan | #D2B48C |
-| teal | #008080 |
-| thistle | #D8BFD8 |
-| tomato | #FF6347 |
-| turquoise | #40E0D0 |
-| violet | #EE82EE |
-| wheat | #F5DEB3 |
-| white | #FFFFFF |
-| whitesmoke | #F5F5F5 |
-| yellow | #FFFF00 |
-| yellowgreen | #9ACD32 |

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/common-attrs.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/common-attrs.md 
b/doc/source/cn/v-0.10/references/common-attrs.md
deleted file mode 100644
index 8ac1c0f..0000000
--- a/doc/source/cn/v-0.10/references/common-attrs.md
+++ /dev/null
@@ -1,166 +0,0 @@
----
-title: 通用特性
-type: references
-order: 1.5
-version: 0.10
----
-
-# 通用特性
-
-特性（attribute）与 HTML 中元素特性类似，提供了与 Weex 元素
有关的其他附加信息。所有的元素都可以拥有特性, 
特性总是在 Weex 元素的起始æ 
‡ç­¾ä¸­å®šä¹‰ï¼Œå¹¶æ€»æ˜¯ä»¥é”®å€¼å¯¹çš„形式出现，例如：`name="value"`。可以使用
 [Mustache](https://mustache.github.io/) 对特性值进行数据绑定。
-
-**Notes!**
-
-Weex 遵循 [HTML attribute](https://en.wikipedia.org/wiki/HTML_attribute) 
命名规范, 所以请 **不要在特性中使用驼峰风格（CamelCase）** 
, 使用`-`连接符的**羊肉串风格（kebab-case）** 
才是更好的命名方式。
-
-所有 Weex 元素都拥有以下特性： 
-
-## id
-
-为 `<template>` 内定义的元素指定一个唯一的 id，通过 
`this.$el(id)` 可以容易地获取一个 Weex 元素
的引用。更多信息可参考 [Instance APIs](./api.html) 
-
-```html
-<template>
-  <div id="wrapper">
-    <list class="list">
-      <cell class="row" repeat="item in rows" id="item-{{$index}}">
-        <text class="item-title">row {{item.id}}</text>
-      </cell>
-    </list>
-  </div>
-</template>
-<style></style>
-
-<script>
-module.exports = {
-  data: {
-    rows:[
-      {id: 1},
-      {id: 2},
-      {id: 3},
-      {id: 4},
-      {id: 5}
-    ]
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/b5032fa96e3e657711916148b1978ad3)
-
-## style
-
-为元素定义行内样式。
-
-```html
-<div style="width: 200px; height: 200px; color: #ff0000;"></div>
-<div style="padding: {{x}}; margin: 0"></div>
-```
-
-## class
-
-为元素定义一个或多个类名（引用样式表中的类）。    
-
-```html
-<div class="button"></div>
-<div class="button {{btnStatus}}"></div>
-```
-
-## repeat
-
-我们可以通过 `repeat` 特性æ 
¹æ®ä¸€ä¸ªæ•°ç»„进行渲染，迭代地生成当前标签的内容。`repeat` 
特性有着 `item in items` 形式的特殊语法，其中，`items` 
是数组数据，`item` 是数组元素迭代的别名。
-
-```html
-<template>
-  <div>
-    <list class="list">
-      <cell class="row" repeat="item in rows" id="item-{{$index}}">
-        <text class="item-title">row {{item.id}}</text>
-      </cell>
-    </list>
-  </div>
-</template>
-
-<style></style>
-
-<script>
-module.exports = {
-  data: {
-    rows:[
-      {id: 1},
-      {id: 2},
-      {id: 3},
-      {id: 4},
-      {id: 5}
-    ]
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/b5032fa96e3e657711916148b1978ad3)
-
-## if
-
-提供一个布尔值来决定是否显示当前标签。当值为 `true` 
时，元素显示，为 `false` 时元素隐藏。
-
-```html
-<div if="true"></div>
-<div if="{{opened}}"></div>
-<div if="{{direction === 'row'}}"></div>
-```
-
-## append
-
-append 特性用于控制渲染次序。它的可选值为 `tree` 或 
`node`，默认为 
`tree`，不支持数据绑定。不同的值会执行不同的渲染过程：
-
-- `append="tree"` 是一次性渲染整个节点æ 
‘，渲染更高效，但是如果页面太大容易造
成较长时间的白屏。
-- `append="node"` 所有节点逐个渲染，整体渲染速度略æ…
¢ï¼Œä½†æ˜¯ç”¨æˆ·ä½“验好一些。
-
-通过 `node` 和 `tree` 
可以精细化地控制页面展示的逻辑和颗粒度，一般比较好的实践为首屏以å†
…按 `tree` 解析，首屏以外按 `node` 解析。
-
-```html
-<div append="tree"></div>
-<div append="node"></div>
-```
-
-## 事件处理 (on...)
-
-在 Weex 标签上注册事件处理器。以 `on` 加 事件名为 
`key`，事件处理函数为 `value`。
-
-```html
-<template>
-  <div class="btn" onClick="alertMsg"><text>Click me</text></div>
-</template>
-
-<style>
-.btn {
-  justify-content: center;
-  align-items: center;
-  width: 200;
-  height: 100;
-  background-color: #ff0000;
-  border-radius: 5;
-  color: #ffffff;
-}
-</style>
-
-<script>
-var modal = require('@weex-module/modal')
-
-module.exports = {
-  data: {},
-  methods: {
-    alertMsg: function (e) {
-      modal.alert({
-        message: 'click',
-        okTitle: 'alert'
-      }, function() {
-      })
-    }
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/97de59d24d7667aa91187d59123d24a6)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/common-event.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/common-event.md 
b/doc/source/cn/v-0.10/references/common-event.md
deleted file mode 100644
index 2554fe1..0000000
--- a/doc/source/cn/v-0.10/references/common-event.md
+++ /dev/null
@@ -1,492 +0,0 @@
----
-title: 通用事件
-type: references
-order: 1.10
-version: 0.10
----
-
-# 通用事件
-
-Weex 
提供了通过事件触发动作的能力，例如在用户点击组件时执行
 JavaScript。下面列出了可被添加到 Weex 
组件上以定义事件动作的属性：
-
-## `click`
-
-当组件上发生点击手势时被触发。
-
-**注意：**
-
-`<input>` 和 `<switch>` 组件目前不支持 `click` 事件，请使用 
`change` 或 `input` 事件来代替。
-
-### 事件对象
-
-- `type`: `click`
-- `target`: 触发点击事件的目标组件
-- `timestamp`: 触发点击事件时的时间戳
-
-### 示例
-
-点击按钮，将弹出弹框，再点击弹框 `×`，关闭弹框。
-
-```html
-<template>
-  <div>
-    <div>
-      <text class="btn" onclick="openDialog">Show Dialog</text>
-    </div>
-
-    <div id="dialog" class="dialog" if="{{isShowDialog}}">
-      <div class="dialog-backdrop"></div>
-      <div class="dialog-content">
-        <div class="dialog-header">
-          <text class="dialog-title">{{dialogTitle}}</text>
-          <text class="close" onclick="closeDialog">×</text>
-        </div>
-        <div class="dialog-body">
-          <text>{{dialogBody}}</text>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-
-<style>
-.dialog-backdrop {
-  opacity: .5;
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  background-color: #000000;
-}
-.dialog {
-  position: fixed;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  justify-content: center;
-  align-items: center;
-}
-.dialog-content {
-  width: 450;
-  background-color: #ffffff;
-}
-.dialog-header {
-  padding: 20;
-  border-bottom-width: 1;
-  border-bottom-style: solid;
-  border-bottom-color: #efefef;
-}
-.dialog-body {
-  padding: 20;
-}
-.close {
-  font-size: 50;
-  position: absolute;
-  right: 10;
-  top: 10;
-}
-.btn {
-  text-align: center;
-  color: #ffffff;
-  padding: 12;
-  background-color: #3071a9;
-  border-color: #285e8e;
-  border-radius: 4;
-}
-</style>
-
-<script>
-  module.exports = {
-    data: {
-      isShowDialog: false,
-      dialogTitle: 'HELLO',
-      dialogBody: 'Weex is best!'
-    },
-    methods: {
-      openDialog: function (e) {
-        this.isShowDialog = true
-      },
-      closeDialog: function (e) {
-        this.isShowDialog = false
-      }
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/6c1dd48b419e614f92581930f42fd366)
-
-## `longpress`
-
-如果一个组件被绑定了 `longpress` 
事件，那么当用户长按这个组件时，该事件将会被触发。
-
-**注意：**
-
-`<input>` 和 `<switch>` 组件目前不支持 `click` 事件，请使用 
`change` 或 `input` 事件来代替。
-
-### 事件对象
-- `type` : `longpress`
-- `target` : 触发长按事件的目标组件
-- `timestamp` : 长按事件触发时的时间戳
-
-### 示例
-
-长按按钮，变换背景色。
-
-```html
-<template>
-  <div style="width: 400; height: 200; background-color: {{bg}};
-    justify-content: center; align-items: center;" onlongpress="{{update}}">
-    <text style="font-size: 60">Press me</text>
-  </div>
-</template>
-
-<script>
-  module.exports = {
-    data: {
-      bg: '#FF0000'
-    },
-    methods: {
-      update: function () {
-        this.bg = this.bg === '#FF0000' ? '#00FF00' : '#FF0000'
-      }
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/14a646ea3d7d5e1de5baaca9061a48b3)
-
-## Appear 事件
-
-如果一个位于某个可滚动区域内的组件被绑定了 `appear` 
事件，那么当这个组件的状态变为在屏幕上可见时，该事件将被触发。
-
-### 事件对象
-
-- `type` : `appear`
-- `target` : 触发 Appear 事件的组件对象
-- `timestamp` : 事件被触发时的时间戳
-- `direction` : 触发事件时屏幕的滚动方向，`up` 或 `down`
-
-### 示例
-
-当滚到最下方时，最后一个 `item` 出现，将会弹出弹框。
-
-```html
-<template>
-  <scroller onviewappear="{{viewappear}}" onviewdisappear="{{viewdisappear}}">
-    <div class="item">
-      <text>scroll 1</text>
-    </div>
-    <div class="item">
-      <text>scroll 2</text>
-    </div>
-    <div class="item">
-      <text>scroll 3</text>
-    </div>
-    <div class="item">
-      <text>scroll 4</text>
-    </div>
-    <div class="item">
-      <text>scroll 5</text>
-    </div>
-    <div class="item">
-      <text>scroll 6</text>
-    </div>
-    <div class="item">
-      <text>scroll 7</text>
-    </div>
-    <div class="item">
-      <text>scroll 8</text>
-    </div>
-    <div class="item">
-      <text>scroll 9</text>
-    </div>
-    <div class="item">
-      <text>scroll 10</text>
-    </div>
-    <div class="item" onappear="alertMsg" >
-      <text>I will alert a message when I appeared.</text>
-    </div>
-  </scroller>
-</template>
-
-<style>
-  .list {
-    height: 850;
-  }
-
-  .count {
-    font-size: 48;
-    margin: 10;
-  }
-
-  .indicator {
-    height: 40;
-    width: 40;
-    color: #45b5f0;
-  }
-
-  .row {
-    width: 750;
-  }
-
-  .item {
-    justify-content: center;
-    border-bottom-width: 2;
-    border-bottom-color: #c0c0c0;
-    height: 200;
-    padding: 20;
-  }
-</style>
-
-<script>
-  var modal = require('@weex-module/modal')
-  module.exports = {
-      data: {},
-      methods: {
-        alertMsg: function (e) {
-          modal.alert({
-            message: 'I am appeared.',
-            okTitle: 'Appear'
-          }, function() {
-          })
-        },
-        viewappear: function () {
-          nativeLog('>>>>>', 'viewappear')
-        },
-        viewdisappear: function () {
-          nativeLog('>>>>>', 'viewdisappear')
-        }
-      }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/4d5335f086dfc9964caed5b1fe4b1aa7)
-
-## Disappear 事件
-
-如果一个位于某个可滚动区域内的组件被绑定了 `disappear` 
事件，那么当这个组件被滑出屏幕变为不可见状态时，该事件将被触发。
-
-### 事件对象
-
-- `type` : `disappear`
-- `target` : 触发 Disappear 事件的组件对象
-- `timestamp` : 事件被触发时的时间戳
-- `direction` : 触发事件时屏幕的滚动方向，`up` 或 `down`
-
-### 示例
-
-当向下滚动到第一个 `item` 消失后，将会弹出弹框。
-
-```html
-<template>
-  <scroller onviewappear="{{viewappear}}" onviewdisappear="{{viewdisappear}}">
-    <div class="item" ondisappear="alertMsg" >
-      <text>I will alert a message when I disappeared.</text>
-    </div>
-    <div class="item">
-      <text>scroll 1</text>
-    </div>
-    <div class="item">
-      <text>scroll 2</text>
-    </div>
-    <div class="item">
-      <text>scroll 3</text>
-    </div>
-    <div class="item">
-      <text>scroll 4</text>
-    </div>
-    <div class="item">
-      <text>scroll 5</text>
-    </div>
-    <div class="item">
-      <text>scroll 6</text>
-    </div>
-    <div class="item">
-      <text>scroll 7</text>
-    </div>
-    <div class="item">
-      <text>scroll 8</text>
-    </div>
-    <div class="item">
-      <text>scroll 9</text>
-    </div>
-    <div class="item">
-      <text>scroll 10</text>
-    </div>
-  </scroller>
-</template>
-
-<style>
-  .list {
-    height: 850;
-  }
-
-  .count {
-    font-size: 48;
-    margin: 10;
-  }
-
-  .indicator {
-    height: 40;
-    width: 40;
-    color: #45b5f0;
-  }
-
-  .row {
-    width: 750;
-  }
-
-  .item {
-    justify-content: center;
-    border-bottom-width: 2;
-    border-bottom-color: #c0c0c0;
-    height: 200;
-    padding: 20;
-  }
-</style>
-
-<script>
-  var modal = require('@weex-module/modal')
-  module.exports = {
-      data: {},
-      methods: {
-        alertMsg: function (e) {
-          modal.alert({
-            message: 'I am disappeared.',
-            okTitle: 'Disappear'
-          }, function() {
-          })
-        },
-        viewappear: function () {
-          nativeLog('>>>>>', 'viewappear')
-        },
-        viewdisappear: function () {
-          nativeLog('>>>>>', 'viewdisappear')
-        }
-      }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/eefa176009207a429bbaf475f6ee92d1)
-
-## Page 事件
-
-*注意：仅支持 iOS 和 Android，H5 暂不支持。*
-
-Weex 通过 `viewappear` 和 `viewdisappear` 
事件提供了简单的页面状态管理能力。
-
-`viewappear` 事件会在页面就要显示或é…
ç½®çš„任何页面动画被执行前触发，例如，当调用 `navigator` 
模块的 `push` 
方法时，该事件将会在打开新页面时被触发。`viewdisappear` 
事件会在页面就要关闭时被触发。
-
-与组件的 `appear` 和 `disappear` 事件不同的是，`viewappear` 和 
`viewdisappear` 事件关注的是整个页面的状态，所以**它们必
须绑定到页面的根元素上**。
-
-特殊情况下，这两个事件也能被绑定到非根元素
的body组件上，例如`wxc-navpage`组件。
-
-### 事件对象
-
-- `type` : `viewappear` 或 `viewdisappear`
-- `target` : 触发事件的组件对象
-- `timestamp` : 事件被触发时的时间戳
-
-### 示例
-
-进出页面时，都会弹框提示。
-
-```html
-<template>
-  <scroller onviewappear="{{alertViewappearMsg}}" 
onviewdisappear="{{alertViewdisappearMsg}}">
-    <div class="item">
-      <text>scroll 1</text>
-    </div>
-    <div class="item">
-      <text>scroll 2</text>
-    </div>
-    <div class="item">
-      <text>scroll 3</text>
-    </div>
-    <div class="item">
-      <text>scroll 4</text>
-    </div>
-    <div class="item">
-      <text>scroll 5</text>
-    </div>
-    <div class="item">
-      <text>scroll 6</text>
-    </div>
-    <div class="item">
-      <text>scroll 7</text>
-    </div>
-    <div class="item">
-      <text>scroll 8</text>
-    </div>
-    <div class="item">
-      <text>scroll 9</text>
-    </div>
-    <div class="item">
-      <text>scroll 10</text>
-    </div>
-    <div class="item" onappear="alertMsg" >
-      <text>scroll 11</text>
-    </div>
-  </scroller>
-</template>
-
-<style>
-  .list {
-    height: 850;
-  }
-
-  .count {
-    font-size: 48;
-    margin: 10;
-  }
-
-  .indicator {
-    height: 40;
-    width: 40;
-    color: #45b5f0;
-  }
-
-  .row {
-    width: 750;
-  }
-
-  .item {
-    justify-content: center;
-    border-bottom-width: 2;
-    border-bottom-color: #c0c0c0;
-    height: 200;
-    padding: 20;
-  }
-</style>
-
-<script>
-  var modal = require('@weex-module/modal')
-  module.exports = {
-      data: {},
-      methods: {
-        alertViewappearMsg: function () {
-          modal.alert({
-            message: 'viewappear.',
-            okTitle: 'viewappear'
-          }, function() {
-          })
-        },
-        alertViewdisappearMsg: function () {
-          modal.alert({
-            message: 'viewdisappear.',
-            okTitle: 'viewdisappear'
-          }, function() {
-          })
-        }
-      }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/450205a8f8612381422220ce88a562ff)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/common-style.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/common-style.md 
b/doc/source/cn/v-0.10/references/common-style.md
deleted file mode 100644
index 8a585f2..0000000
--- a/doc/source/cn/v-0.10/references/common-style.md
+++ /dev/null
@@ -1,322 +0,0 @@
----
-title: 通用样式
-type: references
-order: 1.6
-version: 0.10
----
-
-# 通用样式
-
-所有 Weex 组件都支持以下通用样式规则。
-
-## 盒模型
-
-![box model @300*](http://alibaba.github.io/weex/doc/images/css-boxmodel.png)
-
-Weex 盒模型基于 [CSS 盒模型](https://www.w3.org/TR/css3-box/)，每个 
Weex 元素
都可视作一个盒子。我们一般在讨论设计或布局时，会提到「盒模型」这个概念。
-
-盒模型描述了一个元素所占
用的空间。每一个盒子有四条边界：外边距边界 margin edge, 
边框边界 border edge, 内边距边界 padding edge 与内容边界 content 
edge。这四层边界，形成一层层的盒子包
裹起来，这就是盒模型大体上的含义。
-
-**注意：**
-Weex 对于长度值目前只支持*像素
*值，单位可省略，不支持相对单位（`em`、`rem`）。
-
-- `width {length}`：，默认值 0
-- `height {length}`：，默认值 0
-- `padding {length}`：内边距，内容和边框之间的距离。默认值 0
-
-  可有如下写法：
-
-  - `padding-left {length}`：，默认值 0
-  - `padding-right {length}`：，默认值 0
-  - `padding-top {length}`：，默认值 0
-  - `padding-bottom {length}`：，默认值 0
-- `margin`：
-
-  外边距，元素和元素之间的空白距离。值类型为 
length，默认值 0
-
-  可有如下写法：
-  
-  - `margin-left {length}`：，默认值 0
-  - `margin-right {length}`：，默认值 0
-  - `margin-top {length}`：，默认值 0
-  - `margin-bottom {length}`：，默认值 0
-- border：
-  
-  设定边框，`border` 目前不支持类似这样 `border: 1 solid 
#ff0000;` 的组合写法。
-
-  可有如下写法：
-  
-  - `border-style`：
-
-    设定边框样式，值类型为 string，可选值为 `solid` | `dashed` 
| `dotted`，默认值 `solid`
-
-    可有如下写法：
-  
-    - `border-left-style {string}`：可选值为 `solid` | `dashed` | 
`dotted`，默认值 `solid`
-    - `border-top-style {string}`：可选值为 `solid` | `dashed` | 
`dotted`，默认值 `solid`
-    - `border-right-style {string}`：可选值为 `solid` | `dashed` | 
`dotted`，默认值 `solid`
-    - `border-bottom-style {string}`：可选值为 `solid` | `dashed` | 
`dotted`，默认值 `solid`
-
-  - `border-width {length}`：
-  
-    设定边框宽度，非负值, 默认值 0
-
-    可有如下写法：
-  
-    - `border-left-width {length}`：，非负值, 默认值 0
-    - `border-top-width {length}`：，非负值, 默认值 0
-    - `border-right-width {length}`：，非负值, 默认值 0
-    - `border-bottom-width {length}`：，非负值, 默认值 0
-
-  - `border-color {color}`：
-  
-    设定边框颜色，默认值 `#000000`
-  
-    可有如下写法：
-  
-    - `border-left-color {color}`：，默认值 `#000000`
-    - `border-top-color {color}`：，默认值 `#000000`
-    - `border-right-color {color}`：，默认值 `#000000`
-    - `border-bottom-color {color}`：，默认值 `#000000`
-  - `border-radius {length}`：
-
-    设定圆角，默认值 0
-
-    可有如下写法：
-  
-    - `border-bottom-left-radius {length}`：，非负值, 默认值 0
-    - `border-bottom-right-radius {length}`：，非负值, 默认值 0
-    - `border-top-left-radius {length}`：，非负值, 默认值 0
-    - `border-top-right-radius {length}`：，非负值, 默认值 0
-
-
-注意：目前在 `<image>` 和 `<text>` 组件上尚无
法只定义一个或几个角的 `border-radius`。比如你无
法在这两个组件上使用 `border-top-left-radius`。
-
-Weex 盒模型的 `box-sizing` 默认为 `border-box`，即盒子的宽高包
含内容、内边距和边框的宽度，不包含外边距的宽度。
-
-### 示例：
-
-```html
-<template>
-  <div>
-    <image  style="width: 400; height: 200; margin-left: 20;" 
src="https://g.alicdn.com/mtb/lab-zikuan/0.0.18/weex/weex_logo_b...@3x.png";></image>
-  </div>
-</template>
-```
-
-## Flexbox
-
-Weex 布局模型基于 CSS 
[`Flexbox`](http://www.w3.org/TR/css3-flexbox/)，以便所有页面元素
的排版能够一致可预测，同时页面布局能适应各种设备或者
屏幕尺寸。
-
-Flexbox 包含 flex 容器和 flex 成员项。如果一个 Weex 元素
可以容纳其他元素，那么它就成为 flex 
容器。需要注意的是，flexbox 的老版规范相较新版有些出å…
¥ï¼Œæ¯”如是否能支持 wrapping。这些都描述在 W3C 
的工作草案中了，你
需要注意下新老版本之间的不同。另外，老版本只在安卓 4.4 
版以下得到支持。
-
-### Flex 容器
-
-在 Weex 中，Flexbox 是默认且唯一的布局模型，所以你
不需要手动为元素添加 `display: flex;` 属性。
-
-- `flex-direction`：
-
-  定义了 flex 容器中 flex 成员项的排列方向。可选值为 `row` 
| `column`，默认值为 `column`
-
-   - `column`：从上到下排列。
-   - `row`：从左到右排列。
-
-- `justify-content`：
-
-  定义了 flex 容器中 flex 
成员项在主轴方向上如何排列以处理空白部分。可选值为 
`flex-start` | `flex-end` | `center` | `space-between`，默认值为 
`flex-start`。
-
-  - `flex-start`：是默认值，所有的 flex 
成员项都排列在容器的前部；
-  - `flex-end`：则意味着成员项排列在容器的后部；
-  - 
`center`：即中间对齐，成员项排列在容器中间、两边留白；
-  - `space-between`：表示两端对齐，空白均匀地填充到 flex 
成员项之间。
-
-  ![justify-content 
@400*](http://alibaba.github.io/weex/doc/images/css-flexbox-justify.svg)
-
--  `align-items`：
-
-  定义了 flex 容器中 flex 
成员项在纵轴方向上如何排列以处理空白部分。可选值为 
`stretch` | `flex-start` | `center` | `flex-end`，默认值为 `stretch`。
-
-  - `stretch` 是默认值，即拉伸高度至 flex 容器的大小；
-  - `flex-start` 则是上对齐，所有的成员项排列在容器顶部；
-  - `flex-end` 是下对齐，所有的成员项排列在容器底部；
-  - `center` 是中间对齐，所有成员项都垂直地居中显示。
-
-  ![align-items 
@400*](http://alibaba.github.io/weex/doc/images/css-flexbox-align.jpg)
-
-### Flex 成员项
-
-flex 属性定义了 flex 成员项可以占
用容器中剩余空间的大小。如果所有的成员项设置相同的值 
`flex: 1`，它们将平均分配剩余空间. 
如果一个成员项设置的值为 `flex: 2`，å…
¶å®ƒçš„成员项设置的值为 `flex: 1`，那么这个成员项所占
用的剩余空间是其它成员项的2倍。
-
-- `flex {number}`：值为 number 类型。
-
-### 示例
-
-一个简单的网格布局。
-
-![mobile_preview](images/style_1.jpg)
-
-```html
-<template>
-  <div>
-    <div repeat="(i, v) in list" class="row">
-      <div repeat="(k, text) in v" class="item">
-        <div>
-          <text>{{text}}</text>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-<style>
-  .item{
-    flex:1;
-    justify-content: center;
-    align-items:center;
-    border-width:1;
-  }
-  .row{
-    flex-direction: row;
-    height:80;
-  }
-</style>
-<script>
-  module.exports = {
-    data: function () {
-      return {
-        list:[
-          ['A', 'B', 'C'],
-          ['D', 'E', 'F'],
-          ['G', 'H', 'I']
-        ]
-      }
-    }
-  }
-</script>
-```
-
-[体验一下](http://dotwe.org/ee6a898fcac2242308c24fe5882c52ac)
-
-一个在相对于屏幕水平居中，全屏居中的 `<div>`。
-
-```html
-<template>
-  <div class="wrapper">
-    <div class="box">
-    </div>
-  </div>
-</template>
-
-<style>
-  .wrapper {
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    background-color: #cccccc;
-    justify-content: center;
-    align-items: center;
-  }
-  .box {
-    width: 200;
-    height: 200;
-    background-color: #fc0000;
-  }
-</style>
-```
-
-[体验一下](http://dotwe.org/a76cd89b37c72d308ed576131830e877)
-
-## 定位
-
-Weex 支持 `position` 定位，用法与 CSS position 类似。为元素
设置 `position` 后，可通过 `top`、`right`、`bottom`、`left` 
四个属性设置元素坐标。
-
-- `position {string}`：
-  
-  设置定位类型。可选值为 `relative` | `absolute` | `fixed` | 
`sticky`，默认值为 `relative`。
-
-  - `relative` 是默认值，指的是相对定位；
-  - `absolute` 是绝对定位，以元素的容器作为参考系；
-  - `fixed` 保证元素在页面窗口中的对应位置显示；
-  - `sticky` 指的是仅当元素滚动到页面之外时，元素
会固定在页面窗口的顶部。
-- `top {number}`：距离上方的偏移量，默认为 0。
-- `bottom {number}`：距离下方的偏移量，默认为 0。
-- `left {number}`：距离左方的偏移量，默认为 0。
-- `right {number}`：距离右方的偏移量，默认为 0。
-
-**注意：**
-
-1. Weex 目前不支持 `z-index` 设置元素层级关系，但靠后的元素
层级更高，因此，对于层级高的元素，可将其排列在后面。
-2. 如果定位元素超过容器边界，在 Android 下，超
出部分将**不可见**，原因在于 Android 端元素 `overflow` 
默认值为 `hidden`，但目前 Android 暂不支持设置 `overflow: 
visible`。 
-
-### 示例
-
-![mobile_preview](images/style_2.jpg)
-
-```html
-<template>
-  <div class="wrapper">
-    <div class="box box1">
-    </div>
-    <div class="box box2">
-    </div>
-    <div class="box box3">
-    </div>
-  </div>
-</template>
-
-<style>
-  .wrapper {
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    background-color: #cccccc;
-  }
-  .box {
-    width: 400;
-    height: 400;
-    position: absolute;
-  }
-  .box1 {
-    top: 0;
-    left: 0;
-    background-color: #ff0000;
-  }
-  .box2 {
-    top: 150;
-    left: 150;
-    background-color: #0055dd;
-  }
-  .box3 {
-    top: 300;
-    left: 300;
-    background-color: #00ff49;
-  }
-</style>
-```
-
-[体验一下](http://dotwe.org/b04339de27cfabf0710e045c0079e56a)
-
-## 其他基本样式
-
-- `opacity {number}`：取值范围为 [0, 1] 区间。默认值是 
1，即完全不透明；0 是完全透明；0.5 是 50% 的透明度。
-- `background-color {color}`：设定元素
的背景色，可选值为色值，支持RGB（ `rgb(255, 0, 0)` ）；RGBA（ 
`rgba(255, 0, 0, 0.5)` ）；十六进制（ `#ff0000` 
）；精简写法的十六进制（ `#f00` ）；色值å…
³é”®å­—（`red`），默认值是 `transparent` 。
-
-**注意：** [色值的关键字列表](./color-names.md)。
-
-## 上手样式
-
-如果对于样式写法需要更多上手参考，可参考
-
-- [如何做出高性能长列表]()
-- [如何布局]()
-- 以及每个组件的文档中，都有常见的例子可供参考。
-
-你可以按照以下步骤来规划 Weex 页面的样式。
-
-1. 全局样式规划：将整个页面分割成合适的模块。
-2. flex 布局：排列和对齐页面模块。
-3. 定位盒子：定位并设置偏移量。
-4. 细节样式处理：增加特定的具体样式。

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/component-defs.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/component-defs.md 
b/doc/source/cn/v-0.10/references/component-defs.md
deleted file mode 100644
index 11e4282..0000000
--- a/doc/source/cn/v-0.10/references/component-defs.md
+++ /dev/null
@@ -1,126 +0,0 @@
----
-title: ViewModel 选项
-type: references
-order: 1.2
-version: 0.10
----
-
-# 组件定义
-
-定义组件是通过一组选项来描述一个组件。这组选项总是被赋值给
 `<script>` 标签中的 `module.exports` 。
-
-``` javascript
-module.exports = {
-  // a set of options here
-}
-```
-## 数据和方法
-
-``` javascript
-module.exports = {
-  data: function () {
-    return {x: 1, y: 2}
-  },
-  methods: {
-    doThis: function () {...},
-    doThat: function () {...}
-  },
-  ...
-}
-```
-
-`data` 
选项是一个函数，它返回这个视图模型可监听的数据对象。而
 `methods` 是一个映射，其中包含所有视图模型的方法。
-
-每个 `data` 或 `method` 
属性将被代理到视图模型实例中。所以，你能通过 `this.x` 
读写数据，或者通过 `this.doThis()` 调用方法。
-
-一个完整的例子：
-
-```html
-<template>
-  <div style="width: {{w}}; height: {{h}}; background-color: red;" 
onclick="update"></div>
-</template>
-<script>
-  module.exports = {
-    data: function () {
-      return {w: 750, h: 200}
-    },
-    methods: {
-      update: function (e) {
-        this.h += 200
-      }
-    }
-  }
-</script>
-```
-## 事件
-
-``` javascript
-module.exports = {
-  data: ...,
-  methods: {
-    foo: function () {
-      ...
-      this.$emit('customtype1', data)
-    }
-  },
-  events: {
-    customtype1: function (e) {
-      console.log(e.type, e.detail)
-    }
-  },
-  ...
-}
-```
-
-`events` 选项允许你
在视图模型被创建时注册自定义事件。然后，它会监听这些类型的事件，并通过函数类型的值处理它们。
-
-Weex 会把一个事件对象作为第一个参数传递给å…
¶ç»‘定的事件，这个事件对象在 `e.detail` 中包含事件数据。
-## 生命周期
-
-``` javascript
-module.exports = {
-  data: ...,
-  methods: ...,
-  init: function () {
-    console.log('ViewModel constructor begins')
-  },
-  created: function () {
-    console.log('Data observation finished')
-  },
-  ready: function () {
-    console.log('Virtual DOM finished')
-  },
-  ...
-}
-```
-
-Weex 视图模型现在支持生命周期内
的钩子函数，这些钩子函数能被写为组件选项：
-- `init`: 在视图模型的构造函数开始调用时激活；
-- `created`: 
当视图模型监听默认数据，但还未编译模板时激活；
-- `ready`: 
当视图模型监听默认数据并且编译模板生成虚拟DOM后被激活。
-
-**注意：当 `methods`、`events` 或生命周期方法作为参数传
递给别的函数时，务必
确认函数执行时的上下文符合您的预期，例如：**
-
-``` javascript
-module.exports = {
-  data: function () {
-    return {x: 1, y: 2}
-  },
-  ready: function () {
-    // `undefined`
-    // 因为上下文发生了变化
-    this.foo(this.bar)
-    // `1`
-    // 正确绑定上下文之后可以得到预期的值
-    this.foo(this.bar.bind(this))
-  },
-  methods: {
-    foo: function (fn) {
-      return fn()
-    },
-    bar: function () {
-      return this.x
-    }
-  }
-}
-```

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/components/a.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/components/a.md 
b/doc/source/cn/v-0.10/references/components/a.md
deleted file mode 100644
index 75bd831..0000000
--- a/doc/source/cn/v-0.10/references/components/a.md
+++ /dev/null
@@ -1,273 +0,0 @@
----
-title: <a>
-type: references
-order: 2.1
-version: 0.10
----
-
-# &lt;a&gt;
-
-`<a>` 组件定义了指向某个页面的一个超链接. 
此组件的作用和用法与HTML5中的 
[`<a>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a) 
非常类似，区别在于 Weex 的 `<a>` 组件**不能**直接在里面添加
文本（字符串），如果要展示文本，应该添加 `<text>` 组件。
-
-一个简单例子：
-
-```HTML
-<template>
-  <div class="wrapper">
-    <a href="http://dotwe.org/raw/dist/a468998152ee680413588c38bd61c29e.js";>
-      <text>click</text>
-    </a>
-  </div>
-</template>
-
-<style>
-.wrapper {
-  text-align: center;
-}
-</style>
-```
-
-[体验一下](http://dotwe.org/f63c78213ef26c25357ffa851537fff3)
-
-## 子组件
-
-此组件支持除了自己外的所有 Weex 组件作为子组件。
-
-## 特性
-
-- `href {string}`：定义了超链接的 URL。
-
-## 样式
-
-`<a>` 支持所有通用样式。
-
-- 盒模型
-- `flexbox` 布局
-- `position`
-- `opacity`
-- `background-color`
-
-查看 [组件通用样式](../common-style.html)。
-
-## 事件
-
-`<a>` 支持所有通用事件。
-
-- `click`
-  **注意：**我们不能保证 `click` 事件和 `href` 
跳转的执行顺序。建议不要使用 `click` 事件来处理 `href` 
跳转前的逻辑处理。
-- `longpress`
-- `appear`
-- `disappear`
-
-查看 [通用事件](../common-event.html)。
-
-## 约束
-
-1. **不能**直接在 `<a>` 中添加文本。
-  错误示例，“click” 无法被正常渲染。
-
-  ```HTML
-  <template>
-    <div class="wrapper">
-      <a href="http://dotwe.org/raw/dist/a468998152ee680413588c38bd61c29e.js";>
-        click
-      </a>
-    </div>
-  </template>
-
-  <style>
-  .wrapper {
-    text-align: center;
-  }
-  </style>
-  ```
-
-[体验一下](http://dotwe.org/0a22d65138691a208e3fb1f8f6392b38)
-
-2. 请不要为 `<a>` 添加 `click` 事件。我们不能确保 `click` 
事件和 `href` 跳转的执行顺序。
-
-## 示例
-
-```html
-<template>
-  <div>
-    <list class="list">
-      <header class="header">
-        <text class="title">Search Results</text>
-      </header>
-      <refresh style="width: 750; padding: 30;" onrefresh="refreshData" 
display="{{refreshDisplay}}">
-        <text class="text"> ↓ Pull to refresh </text>
-        <loading-indicator class="indicator"></loading-indicator>
-      </refresh>
-      <cell class="row" repeat="item in items" id="item-{{$index}}">
-        <div class="lines">
-          <text class="item">Repo name: </text><a 
href="{{item.repo_url}}"><text class="link">{{item.full_name}}</text></a>
-        </div>
-        <div>
-          <text class="item">Repo star: {{item.stargazers_count}}</text>
-        </div>
-      </cell>
-      <loading onloading="loadingData" style="width: 750; padding: 30;" 
display="{{loadingDisplay}}">
-        <text class="text">{{loadingText}}</text>
-      </loading>
-    </list>
-    <div class="up" onclick="goToTop">
-      <img class="img" 
src="https://img.alicdn.com/tps/TB1ZVOEOpXXXXcQaXXXXXXXXXXX-200-200.png";></img>
-    </div>
-  </div>
-</template>
-
-<style>
-.header {
-  padding: 25;
-  background-color: #efefef;
-  border-bottom-color: #eeeeee;
-  border-bottom-width: 2;
-  border-bottom-style: solid;
-}
-.title {
-  text-align: center;
-}
-.text {
-  text-align: center;
-}
-.list {
-  background-color: #ffffff;
-}
-.row {
-  padding: 20;
-  border-bottom-color: #eeeeee;
-  border-bottom-width: 2;
-  border-bottom-style: solid;
-}
-.up {
-  width: 70;
-  height: 70;
-  position: fixed;
-  right: 20;
-  bottom: 20;
-}
-.img {
-  width: 70;
-  height: 70;
-}
-.lines {
-  flex-direction: row;
-}
-.link {
-  color: #008cff;
-  text-decoration: underline;
-}
-</style>
-
-<script>
-var dom = require('@weex-module/dom') || {}
-var stream = require('@weex-module/stream') || {}
-var modal = require('@weex-module/modal') || {}
-
-var SEARCH_URL = 
'https://api.github.com/search/repositories?q=language:javascript&sort=stars&order=desc',
-    PAGE_URL = 'http://dotwe.org/raw/dist/f1fa0895d0fa0fd80896e02a589443dd.js'
-
-module.exports = {
-  data: {
-    isLoaded: true,
-    page: 1,
-    loadingDisplay: 'hide',
-    refreshDisplay: 'hide',
-    loadingText: 'Loading...',
-    items:[]
-  },
-  created: function () {
-    var url = SEARCH_URL + '&page=' + this.page
-
-    this.renderData(url)
-
-    this.page++
-  },
-  methods: {
-    renderData: function (url) {
-      var self = this
-      
-      stream.fetch({
-        method: 'GET',
-        url: url,
-        type:'json'
-      }, function(res) {
-        try {
-          var results = res.data.items || []
-          
-          if (Array.isArray(results)) {
-            for(var i = 0; i < results.length; i++) {
-              var repo_url = results[i].html_url
-              if (repo_url) {
-                results[i].repo_url = self.processUrl(repo_url)
-              }
-              self.items.push(results[i])
-            }
-          }
-        } catch(e) {}
-      },function(res){
-          
-      })
-    },
-    loadingData: function (e) {
-      var url = SEARCH_URL + '&page=' + this.page
-      var self = this
-      
-      if (self.isLoaded === false) return 
-      
-      self.loadingDisplay = 'show'
-
-      if (self.page <=10 ) {
-        self.renderData(url)
-        self.page++
-      } else {
-        self.loadingDisplay = 'hide'
-        self.loadingText = 'NO MORE!'
-      }
-    },
-    goToTop: function (e) {
-      dom.scrollToElement(this.$el('item-0'), {
-        offset: -100
-      })
-    },
-    refreshData: function (e) {
-      var url = SEARCH_URL + '&page=1'
-
-      if (this.isLoaded === false) return 
-      
-      this.refreshDisplay = 'show'
-
-      modal.toast({
-        'message': 'Refreshing...', 
-        'duration': 1
-      })
-      
-      this.items = []
-      this.page = 1
-      this.renderData(url)
-
-      this.refreshDisplay = 'hide'
-    },
-    processUrl: function (url) {
-      var platform = this.$getConfig().env.platform.toLowerCase()
-      
-      
-      if (url) {
-        // iOS do not need encode
-        if (platform === 'ios') {
-          return PAGE_URL + '?weburl=' + url
-        } else if (platform === 'web') {
-          return url
-        } else {
-          var encodeUrl = encodeURIComponent(url)
-          return PAGE_URL + '?weburl=' + encodeUrl
-        }
-      }
-    }
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/3e8369efb20a169077b5331b45927ed8)。

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/v-0.10/references/components/cell.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/v-0.10/references/components/cell.md 
b/doc/source/cn/v-0.10/references/components/cell.md
deleted file mode 100644
index e977037..0000000
--- a/doc/source/cn/v-0.10/references/components/cell.md
+++ /dev/null
@@ -1,191 +0,0 @@
----
-title: <cell>
-type: references
-order: 2.5
-version: 0.10
----
-
-# &lt;cell&gt;
-
-用于定义列表中的子列表项，类似于 HTML 中的 `ul` 之于 
`li`。Weex 会对 `<cell>` 进行高效的内
存回收以达到更好的性能，该组件必
须作为[`<list>`](./list.html) 组件的子组件, 
这是为了优化滚动时的性能。
-
-## 子组件
-
-支持所有 Weex 的组件作为它的子组件。
-
-## 样式
-
-**注意：**
-
-你不能给 `<cell>` 设定`flex`值。 `<cell>`的宽度等于父组件 
`<list>` 的宽度，并且 `<cell>` 高度自适应。
-
-- 通用样式：支持所有通用样式
-
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- 通用事件
-
-  支持所有通用事件：
-
-  - `click`
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-## 示例
-
-![mobile_preview](../images/list_3.jpg)
-
-```html
-<template>
-  <div>
-    <list class="list">
-      <header class="header">
-        <text class="title">Search Results</text>
-      </header>
-      <refresh style="width: 750; padding: 30;" onrefresh="refreshData">
-        <text class="text"> ↓ Pull to refresh </text>
-        <loading-indicator class="indicator"></loading-indicator>
-      </refresh>
-      <cell class="row" repeat="item in items" id="item-{{$index}}">
-        <div>
-          <text class="item">Repo name: {{item.full_name}}</text>
-        </div>
-        <div>
-          <text class="item">Repo star: {{item.stargazers_count}}</text>
-        </div>
-      </cell>
-      <loading onloading="loadingData" style="width: 750; padding: 30;" 
display="{{loadingDisplay}}">
-        <text class="text">{{loadingText}}</text>
-      </loading>
-    </list>
-    <div class="up" onclick="goToTop">
-      <img class="img" 
src="https://img.alicdn.com/tps/TB1ZVOEOpXXXXcQaXXXXXXXXXXX-200-200.png";></img>
-    </div>
-  </div>
-</template>
-
-<style>
-.header {
-  padding: 25;
-  background-color: #efefef;
-  border-bottom-color: #eeeeee;
-  border-bottom-width: 2;
-  border-bottom-style: solid;
-}
-.title {
-  text-align: center;
-}
-.text {
-  text-align: center;
-}
-.list {
-  background-color: #ffffff;
-}
-.row {
-  padding: 20;
-  border-bottom-color: #eeeeee;
-  border-bottom-width: 2;
-  border-bottom-style: solid;
-}
-.up {
-  width: 70;
-  height: 70;
-  position: fixed;
-  right: 20;
-  bottom: 20;
-}
-.img {
-  width: 70;
-  height: 70;
-}
-</style>
-
-<script>
-var dom = require('@weex-module/dom') || {}
-var stream = require('@weex-module/stream') || {}
-var modal = require('@weex-module/modal') || {}
-
-var SEARCH_URL = 
'https://api.github.com/search/repositories?q=language:javascript&sort=stars&order=desc'
-
-module.exports = {
-  data: {
-    page: 1,
-    loadingDisplay: 'show',
-    loadingText: 'Loading...',
-    items:[]
-  },
-  created: function () {
-    var url = SEARCH_URL + '&page=' + this.page
-
-    this.renderData(url)
-
-    this.page++
-  },
-  methods: {
-    renderData: function (url) {
-      var self = this
-
-      stream.fetch({
-        method: 'GET',
-        url: url,
-        type:'json'
-      }, function(res) {
-        try {
-          var results = res.data.items || []
-
-          if (Array.isArray(results)) {
-            for(var i = 0; i < results.length; i++) {
-              self.items.push(results[i])
-            }
-          }
-        } catch(e) {}
-      },function(res){
-
-      })
-    },
-    loadingData: function (e) {
-      var url = SEARCH_URL + '&page=' + this.page
-      var self = this
-
-      if (self.page <=10 ) {
-        self.renderData(url)
-        self.page++
-      } else {
-        self.loadingDisplay = 'hide'
-        self.loadingText = 'NO MORE!'
-      }
-    },
-    goToTop: function (e) {
-      dom.scrollToElement(this.$el('item-0'), {
-        offset: -100
-      })
-    },
-    refreshData: function (e) {
-      var url = SEARCH_URL + '&page=1'
-
-      modal.toast({
-        'message': 'Refreshing...',
-        'duration': 1
-      })
-
-      this.items = []
-      this.page = 1
-      this.renderData(url)
-    }
-  }
-}
-</script>
-```
-
-[体验一下](http://dotwe.org/280fa3dc8e793ea8712451ecdf84fb7b)
\ No newline at end of file