http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/common-style.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/common-style.md 
b/doc/source/cn/references/common-style.md
deleted file mode 100644
index 3af25bc..0000000
--- a/doc/source/cn/references/common-style.md
+++ /dev/null
@@ -1,627 +0,0 @@
----
-title: 通用样式
-type: references
-order: 1.4
-version: 2.1
----
-
-# 通用样式
-
-所有 Weex 组件都支持以下通用样式规则。
-
-## 盒模型
-
-![box model @300*](./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
-
-
-### 注意:
-
-Weex 盒模型的 `box-sizing` 默认为 `border-box`,即盒子的宽高包
含内容、内边距和边框的宽度,不包含外边距的宽度。
-
-目前在 `<image>` 组件上尚无法只定义一个或几个角的 
`border-radius`。比如你无法在这两个组件上使用 
`border-top-left-radius`。该约束只对 iOS 生效,Android 
并不受此限制。
-
-尽管 `overflow:hidden` 在 Android 
上是默认行为,但只有下列条件都满足时,一个父 view 
才会去 clip 它的子 view。这个限制只对 Android 生效,iOS 
不受影响。
-* 父view是`div`, `a`, `cell`, `refresh` 或 `loading`。
-* 系统版本是 Android 4.3 或更高。
-* 系统版本不是 Andorid 7.0。
-* 父 view 没有 `background-image` 属性或系统版本是 Android 5.0 
或更高。
-
-### 示例:
-
-```html
-<template>
-  <div>
-    <image  style="width: 400px; height: 200px; margin-left: 20px;" 
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*](./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*](./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 v-for="(v, i) in list" class="row">
-      <div v-for="(text, k) in v" class="item">
-        <div>
-          <text>{{text}}</text>
-        </div>
-      </div>
-    </div>
-  </div>
-</template>
-<style scoped>
-  .item{
-    flex:1;
-    justify-content: center;
-    align-items:center;
-    border-width:1;
-  }
-  .row{
-    flex-direction: row;
-    height:80px;
-  }
-</style>
-<script>
-  module.exports = {
-    data: function () {
-      return {
-        list:[
-          ['A', 'B', 'C'],
-          ['D', 'E', 'F'],
-          ['G', 'H', 'I']
-        ]
-      }
-    }
-  }
-</script>
-```
-
-一个在相对于屏幕水平居中,全屏居中的 `<div>`。
-
-```html
-<template>
-  <div class="wrapper">
-    <div class="box">
-    </div>
-  </div>
-</template>
-
-<style scoped>
-  .wrapper {
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    background-color: #cccccc;
-    justify-content: center;
-    align-items: center;
-  }
-  .box {
-    width: 200px;
-    height: 200px;
-    background-color: #fc0000;
-  }
-</style>
-```
-
-## 定位
-
-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 scoped>
-  <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: 400px;
-    height: 400px;
-    position: absolute;
-  }
-  .box1 {
-    top: 0;
-    left: 0;
-    background-color: #ff0000;
-  }
-  .box2 {
-    top: 150px;
-    left: 150px;
-    background-color: #0055dd;
-  }
-  .box3 {
-    top: 300px;
-    left: 300px;
-    background-color: #00ff49;
-  }
-</style>
-```
-
-## transform
-
-transform 属性向元素应用 2D 转换。该属性允许我们对元素
进行旋转、缩放、移动或倾斜。
-
-目前支持的 transform 声明格式:
-
-- translate( <number/percentage> [, <number/percentage>]?)
-- translateX( <number/percentage> )
-- translateY( <number/percentage> )
-- scale( <number>)
-- scaleX( <number> )
-- scaleY( <number> )
-- rotate( <angle/degree> )
-- rotateX( <angle/degree> ) <span class="api-version">v0.14+</span>
-- rotateY( <angle/degree> ) <span class="api-version">v0.14+</span>
-- perspective( <number> ) Android 4.1及以上版本支持 <span 
class="api-version">v0.16+</span>
-- transform-origin: number/percentage/keyword(top/left/right/bottom)
-
-### 示例
-
-```HTML
-<template>
-  <div class="wrapper">
-    <div class="transform">
-     <text class="title">Transformed element</text>
-    </div>
-  </div>
-</template>
-
-<style>
-  .transform {
-    align-items: center; 
-    transform: translate(150px,200px) rotate(20deg);
-    transform-origin: 0 -250px;
-    border-color:red;
-    border-width:2px;
-  }
-  .title {font-size: 48px;}
-</style>
-```
-
-
-
-## transition <span class="api-version">v0.17.0+</span>
-
-现在您可以在CSS中使用transition属性来提升您应用的交互性与视觉感受,transition中åŒ
…
括布局动画,即LayoutAnimation,现在布局产生变化的同时也能使用transition带来的流ç•
…动画。transition允许CSS的属性值在一定的时间区间内
平滑地过渡。
-
-### 参数
-
-- ``transition-property``:允许过渡动画的属性名,设置不同æ 
·å¼transition效果的键值对,默认值为空,表示不执行任何transition,下表列出了所有合法的参数属性:
-
-| 参数名             | 描述                             |
-| --------------- | ------------------------------ |
-| width           | 
transition过渡执行的时候是否组件的宽度参与动画   |
-| height          | 
transition过渡执行的时候是否组件的高度参与动画   |
-| top             | 
transition过渡执行的时候是否组件的顶部距离参与动画 |
-| bottom          | 
transition过渡执行的时候是否组件的底部距离参与动画 |
-| left            | 
transition过渡执行的时候是否组件的左侧距离参与动画 |
-| right           | 
transition过渡执行的时候是否组件的右侧距离参与动画 |
-| backgroundColor | 
transition过渡执行的时候是否组件的背景颜色参与动画 |
-| opacity         | 
transition过渡执行的时候是否组件的不透明度参与动画 |
-| transform       | 
transition过渡执行的时候是否组件的变换类型参与动画 |
-
-- ``transition-duration``:指定transition过渡的持续时间 
(单位是毫秒),默认值是 `0`,表示没有动画效果。
-
-- 
``transition-delay``:指定请求transition过渡操作到执行transition过渡之间的时间间隔
 (单位是毫秒或者秒),默认值是 
`0`,表示没有延迟,在请求后立即执行transition过渡。
-
-- 
``transition-timing-function``:描述transition过渡执行的速度曲线,用于使transition过渡更为平滑。默认值是
 `ease`。下表列出了所有合法的属性:
-
-| 属性名                            | 描述                                
       |
-| ------------------------------ | ---------------------------------------- |
-| ease                         | transition过渡逐渐变慢的过渡效果   
                 |
-| ease-in                      | transition过渡æ…
¢é€Ÿå¼€å§‹ï¼Œç„¶åŽå˜å¿«çš„过渡效果               |
-| ease-out                     | transition过渡快速开始,然后变æ…
¢çš„过渡效果               |
-| ease-in-out                  | transition过渡æ…
¢é€Ÿå¼€å§‹ï¼Œç„¶åŽå˜å¿«ï¼Œç„¶åŽæ…¢é€Ÿç»“束的过渡效果        |
-| linear                       | transition过渡以匀速变化               
         |
-| cubic-bezier(x1, y1, x2, y2) | 
使用三阶贝塞尔函数中自定义transition变化过程,函数的参数值å¿
…须处于 0 到 1 之间。更多关于三次贝塞尔的信息请参阅 
[cubic-bezier](http://cubic-bezier.com/) 和 [Bézier 
curve](https://en.wikipedia.org/wiki/B%C3%A9zier_curve). |
-
-### 示例
-
-```html
-<style scoped>
-    .panel {
-        margin: 10px;
-        top:10px;
-        align-items: center;
-        justify-content: center;
-        border: solid;
-        border-radius: 10px; 
-          
-        transition-property: width,height,backgroundColor;  
-        transition-duration: 0.3s; 
-        transition-delay: 0s;
-        transition-timing-function: cubic-bezier(0.25, 0.1, 0.25, 1.0); 
-    }
-</style>
-```
-
-## 伪类 <span class="api-version">v0.9.5+</span>
-
-Weex 支持四种伪类:`active`, `focus`, `disabled`, `enabled`
-
-所有组件都支持 `active`, 但只有 `input` 组件和 `textarea` 
组件支持 `focus`, `enabled`, `disabled`。
-
-### 规则
-
-- 同时生效的时候,优先级高覆盖优先级低
-
-   - 例如:`input:active:enabled` 和 `input:active` 同时生效,前者
覆盖后者
-
-- 互联规则如下所示
-
-  ![rule](https://img.alicdn.com/tps/TB1KGwIPpXXXXbxXFXXXXXXXXXX-400-205.png)
-
-### 示例
-
-```html
-<template>
-  <div class="wrapper">
-    <image :src="logoUrl" class="logo"></image>
-  </div>
-</template>
-
-<style scoped>
-  .wrapper {
-    align-items: center;
-    margin-top: 120px;
-  }
-  .title {
-    font-size: 48px;
-  }
-  .logo {
-    width: 360px;
-    height: 82px;
-    background-color: red;
-  }
-  .logo:active {
-    width: 180px;
-    height: 82px;
-    background-color: green;
-  }
-</style>
-
-<script>
-  export default {
-    props: {
-      logoUrl: {
-        default: 'https://alibaba.github.io/weex/img/weex_logo_b...@3x.png'
-      },
-      target: {
-        default: 'World'
-      }
-    },
-    methods: {
-      update (e) {
-        this.target = 'Weex';
-      }
-    }
-  };
-</script>
-```
-
-[试一下](http://dotwe.org/vue/df2c8f254620d6d30d0906ee75fe5b99)
-
-## 线性渐变 <span class="api-version">v0.10+</span>
-
-Weex 支持线性渐变背景,具体介绍可参考 [W3C description of the 
gradient](https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Images/Using_CSS_gradients)。
-
-所有组件均支持线性渐变。
-
-### 使用
-
- 你可以通过 `background-image` 属性创建线性渐变。
-
-```css
-background-image: linear-gradient(to top,#a80077,#66ff00);
-```
-
-目前暂不支持 `radial-gradient`(径向渐变)。
-
-Weex 目前只支持两种颜色的渐变,渐变方向如下:
-
-* to right
-  从左向右渐变
-* to left
-  从右向左渐变
-* to bottom
-  从上到下渐变
-* to top
-  从下到上渐变
-* to bottom right
-  从左上角到右下角
-* to top left
-  从右下角到左上角
-
-### Note
-
-- `background-image` 优先级高于 
`background-color`,这意味着同时设置 `background-image` 和 
`background-color`,`background-color` 被覆盖。
-- 不要使用 `background` 简写.
-
-### 示例
-
-```html
-<template>
-  <scroller style="background-color: #3a3a3a">
-    <div class="container1" style="background-image:linear-gradient(to 
right,#a80077,#66ff00);">
-      <text class="direction">to right</text>
-    </div>
-    <div class="container1" style="background-image:linear-gradient(to 
left,#a80077,#66ff00);">
-      <text class="direction">to left</text>
-    </div>
-    <div class="container1" style="background-image:linear-gradient(to 
bottom,#a80077,#66ff00);">
-      <text class="direction">to bottom</text>
-    </div>
-    <div class="container1" style="background-image:linear-gradient(to 
top,#a80077,#66ff00);">
-      <text class="direction">to top</text>
-    </div>
-    <div style="flex-direction: row;align-items: center;justify-content: 
center">
-      <div class="container2" style="background-image:linear-gradient(to 
bottom right,#a80077,#66ff00);">
-        <text class="direction">to bottom right</text>
-      </div>
-      <div class="container2" style="background-image:linear-gradient(to top 
left,#a80077,#66ff00);">
-        <text class="direction">to top left</text>
-      </div>
-    </div>
-  </scroller>
-</template>
-<style>
-  .container1 {
-    margin: 10px;
-    width: 730px;
-    height: 200px;
-    align-items: center;
-    justify-content: center;
-    border: solid;
-    border-radius: 10px;
-  }
-
-  .container2 {
-    margin: 10px;
-    width: 300px;
-    height: 300px;
-    align-items: center;
-    justify-content: center;
-    border: solid;
-    border-radius: 10px;
-  }
-
-  .direction {
-    font-size: 40px;
-    color: white;
-  }
-</style>
-```
-
-## 阴影(box-shadow) <span class="api-version">v0.11+</span>
-
-Weex 支持阴影属性:`active`, `focus`, `disabled`, `enabled` 
`inset(可选)`,`offset-x`,`offset-y`, `blur-radius`,`color`
-
-
-### 注意
-
-- box-shadow仅仅支持iOS
-
-### 示例
-
-```html
-<template>
-  <div class="wrapper">
-    <div style="width:400px; height:60px;background-color: #FFE4C4; 
box-shadow:20px  10px rgb(255, 69, 0);">
-      <text class="title" style="text-align: center">Hello {{target}}</text>
-    </div>
-    <div style="margin-top: 80px;width:400px; height:60px;background-color: 
#FFE4C4; box-shadow: 20px  10px 5px rgba(255, 69, 0, 0.8);">
-      <text class="title" style="text-align: center">Hello {{target}}</text>
-    </div>
-    <div style="margin-top: 80px;width:400px; height:60px;background-color: 
#FFE4C4; box-shadow:inset 20px  10px 5px rgba(255, 69, 0, 0.8);">
-      <text class="title" style="text-align: center">Hello {{target}}</text>
-    </div>
-    <div style="margin-top: 80px;width:400px; height:60px;background-color: 
#FFE4C4; box-shadow:inset 20px  10px 5px rgb(255, 69, 0);">
-      <text class="title" style="text-align: center">Hello {{target}}</text>
-    </div>
-    <div style="margin-top: 80px;width:400px; height:60px;background-color: 
#FFE4C4; box-shadow:20px  10px 5px black;">
-      <text class="title" style="text-align: center">Hello {{target}}</text>
-    </div>
-    <div style="margin-top: 80px;width:400px; height:60px;background-color: 
#FFE4C4; box-shadow:20px  10px 5px #008B00;">
-      <text class="title" style="text-align: center">Hello {{target}}</text>
-    </div>
-  </div>
-</template>
-
-<style scoped>
-  .wrapper {align-items: center; margin-top: 120px;}
-  .title {font-size: 48px;}
-</style>
-
-<script>
-  module.exports = {
-    data: function () {
-      return {
-        logoUrl: 'https://alibaba.github.io/weex/img/weex_logo_b...@3x.png',
-        target: 'World'
-      };
-    }
-  };
-</script>
-```
-
-## 其他基本样式
-
-- `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.html)。
-
-## 上手样式
-
-如果对于æ 
·å¼å†™æ³•éœ€è¦æ›´å¤šä¸Šæ‰‹å‚考,可参考每个组件的文档中,都有常见的例子可供参考。
-
-你可以按照以下步骤来规划 Weex 页面的样式。
-
-1. 全局样式规划:将整个页面分割成合适的模块。
-2. flex 布局:排列和对齐页面模块。
-3. 定位盒子:定位并设置偏移量。
-4. 细节样式处理:增加特定的具体样式。

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/a.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/a.md 
b/doc/source/cn/references/components/a.md
deleted file mode 100644
index 5e54b0c..0000000
--- a/doc/source/cn/references/components/a.md
+++ /dev/null
@@ -1,85 +0,0 @@
----
-title: <a>
-type: references
-order: 2.1
-version: 2.1
----
-
-# &lt;a&gt;
-
-`<a>` 组件定义了指向某个页面的一个超链接. 
此组件的作用和用法与HTML5中的 
[`<a>`](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/a) 
非常类似,区别在于 Weex 的 `<a>` 组件**不能**直接在里面添加
文本(字符串),如果要展示文本,应该添加 `<text>` 组件。
-
-## 子组件
-
-此组件支持除了自己外的所有 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)。
-
-## 约束
-
-- **不能**直接在 `<a>` 中添加文本。
-
-- 请不要为 `<a>` 添加 `click` 事件。我们不能确保 `click` 
事件和 `href` 跳转的执行顺序。
-
-## 示例
-
-```html
-<template>
-  <div class="wrapper">
-    <a class="button" 
href="http://dotwe.org/raw/dist/3e0e40f9ddad79f98cd236753965ffd8.js";>
-      <text class="text">Jump</text>
-    </a>
-  </div>
-</template>
-
-<style scoped>
-  .wrapper {
-    flex-direction: column;
-    justify-content: center;
-  }
-  .button {
-    width: 450px;
-    margin-top: 30px;
-    margin-left: 150px;
-    padding-top: 20px;
-    padding-bottom: 20px;
-    border-width: 2px;
-    border-style: solid;
-    border-color: #DDDDDD;
-    background-color: #F5F5F5
-  }
-  .text {
-    font-size: 60px;
-    color: #666666;
-    text-align: center;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/025db54e37123ab5336a4b848397660f)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/cell.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/cell.md 
b/doc/source/cn/references/components/cell.md
deleted file mode 100644
index 09f402f..0000000
--- a/doc/source/cn/references/components/cell.md
+++ /dev/null
@@ -1,108 +0,0 @@
----
-title: <cell>
-type: references
-order: 2.6
-version: 2.1
----
-
-# &lt;cell&gt;
-
-用于定义列表中的子列表项,类似于 HTML 中的 `ul` 之于 
`li`。Weex 会对 `<cell>` 进行高效的内
存回收以达到更好的性能,该组件必
须作为[`<list>`](./list.html) 组件的子组件, 
这是为了优化滚动时的性能。
-
-## 子组件
-
-支持所有 Weex 的组件作为它的子组件。
-
-## 属性
-*  `keep-scroll-position {boolean}`: <span class="api-version">v0.11+</span> 
List 插入数据后是否保持上次滚动的位置
-
-## 样式
-
-**注意:**
-
-由于 `<cell>` 本身是一个容器,其布局由 `<list>` 
进行管理,你不能给 `<cell>` 设定`flex`值。 
`<cell>`的宽度等于父组件 `<list>` 的宽度,并且 `<cell>` 
高度自适应,指定 `margin` 样式也不起作用。
-
-- 通用样式:支持所有通用样式
-
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- 通用事件
-
-  支持所有通用事件:
-
-  - `click`
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-## 示例
-
-```html
-<template>
-  <list class="list" @loadmore="fetch" loadmoreoffset="10">
-    <cell class="cell" v-for="num in lists">
-      <div class="panel">
-        <text class="text">{{num}}</text>
-      </div>
-    </cell>
-  </list>
-</template>
-
-<script>
-  const modal = weex.requireModule('modal')
-  const LOADMORE_COUNT = 4
-
-  export default {
-    data () {
-      return {
-        lists: [1, 2, 3, 4, 5]
-      }
-    },
-    methods: {
-      fetch (event) {
-        modal.toast({ message: 'loadmore', duration: 1 })
-
-        setTimeout(() => {
-          const length = this.lists.length
-          for (let i = length; i < length + LOADMORE_COUNT; ++i) {
-            this.lists.push(i + 1)
-          }
-        }, 800)
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  .panel {
-    width: 600px;
-    height: 250px;
-    margin-left: 75px;
-    margin-top: 35px;
-    margin-bottom: 35px;
-    flex-direction: column;
-    justify-content: center;
-    border-width: 2px;
-    border-style: solid;
-    border-color: rgb(162, 217, 192);
-    background-color: rgba(162, 217, 192, 0.2);
-  }
-  .text {
-    font-size: 50px;
-    text-align: center;
-    color: #41B883;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/d31c85e7cd2dc54fa098e920a5376c38)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/div.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/div.md 
b/doc/source/cn/references/components/div.md
deleted file mode 100644
index 90d8711..0000000
--- a/doc/source/cn/references/components/div.md
+++ /dev/null
@@ -1,116 +0,0 @@
----
-title: <div>
-type: references
-order: 2.3
-version: 2.1
----
-
-# &lt;div&gt;
-
-`<div>` 组件是用于包装å…
¶å®ƒç»„件的最基本容器。支持所有的通用样式、特性、`flexbox` 
布局。其类似于 HTML 的 `<div>` 
容器,但**不能**直接在里面添加
文本(字符串),如果要展示文本,应该使用 `<text>` 
组件。历史版本中,`<div>` 别名是 
`<container>`,目前**已经弃用**。
-
-**注意:**
-
-`<div>` 
嵌套层级不可过深,否则容易引起性能问题,建议控制在 
**10** 层以内。
-
-一个简单例子:
-
-```html
-<template>
-  <div>
-    <text class="text">Hello World!</text>
-  </div>
-</template>
-
-<style>
-.text {
-  font-size: 70px;
-  color: #ff0000
-}
-</style>
-
-<script></script>
-```
-
-[体验一下](http://dotwe.org/vue/ea4f528a0b381640b77ba03fcc69a90a)
-
-![mobile_preview](../images/div_1.jpg)
-
-## 子组件
-
-`<div>` 基本容器组件,因此支持包括 `<div>` 在内
的任何组件作为自己的子组件。因
此,在写一个组件时,推荐外层使用 `<div>` 作为根容器。
-
-## 样式
-
-`<div>` 支持所有通用样式:
-
-- 盒模型
-- `flexbox` 布局
-- `position`
-- `opacity`
-- `background-color`
-
-查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-`<div>` 支持所有通用事件:
-
-- `click`
-- `longpress`
-- `appear`
-- `disappear`
-
-查看 [通用事件](../common-event.html)
-
-## 约束
-
-1. **不能**直接在 `<div>` 中添加文本。
-
-  错误示例,“Hello World!” 无法被正常渲染。
-
-  ```html
-  <template>
-    <div>Hello World!</div>
-  </template>
-
-  <style>
-  .text {
-    font-size: 70;
-    color: #ff0000
-  }
-  </style>
-
-  <script></script>
-  ```
-
-  [体验一下](http://dotwe.org/vue/541f016de379c8764ddcdd9da0cabc24)
-
-2. `<div>` 在 native 中不可滚动,即使显式设置高度也一样。
-
-  [错误示例](http://dotwe.org/vue/6795753d1a51662b8a7282b129dc7ddf)
-
-## 示例
-
-```html
-<template>
-  <div>
-    <div class="box"></div>
-  </div>
-</template>
-
-<style scoped>
-  .box {
-    border-width: 2px;
-    border-style: solid;
-    border-color: #BBB;
-    width: 250px;
-    height: 250px;
-    margin-top: 250px;
-    margin-left: 250px;
-    background-color: #EEE;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/edfbd1806508cb86254b03dc0b8e28ac)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/image.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/image.md 
b/doc/source/cn/references/components/image.md
deleted file mode 100644
index c096a48..0000000
--- a/doc/source/cn/references/components/image.md
+++ /dev/null
@@ -1,185 +0,0 @@
----
-title: <image>
-type: references
-order: 2.4
-version: 2.1
----
-
-# &lt;image&gt;
-
-`<image>` 组件用于渲染图片,并且它不能包
含任何子组件。新版 Vue 2.0 中**不支持**用 `<img>` 作简写。
-
-需要注意的是,需要明确指定 `width` 和 `height`,否则图片无
法显示。
-
-简单例子:
-
-```html
-<template>
-  <div>
-    <image style="width: 560px;height: 560px;" 
src="https://img.alicdn.com/tps/TB1z.55OFXXXXcLXXXXXXXXXXXX-560-560.jpg";></image>
-  </div>
-</template>
-```
-
-[体验一下](http://dotwe.org/vue/1d6145d98cbdb8c66c69b4d4dcd2744d)
-
-## 子组件
-
-`<image>` 组件不支持任何子组件,因此不要尝试在 `<image>` 
组件中添加任何组件。如果需要实现 `background-image` 
的效果,可以使用 `<image>` 组件和 `position` 
定位来现实,如下面代码。
-
-```html
-<template>
-  <div>
-    <image style="width:750px; height:750px;" 
src="https://img.alicdn.com/tps/TB1z.55OFXXXXcLXXXXXXXXXXXX-560-560.jpg";></image>
-    <div class="title">
-      <text style="font-size:50px; color: #ff0000">你好,image</text>
-    </div>
-  </div>
-</template>
-<style>
-  .title{
-    position:absolute;
-    top:50;
-    left:10;
-  }
-</style>
-```
-
-[体验一下](http://dotwe.org/vue/0a81d27b5dbc68ea3bf5f9fd56c882e8)
-
-## 特性
-
-`<image>` 组件,包含 `src` 和 `resize` 两个重要特性。
-
-- `src {string}`:定义图片链接,目前图片暂不支持本地图片。
-- `resize {string}`:可以控制图片的拉伸状态,值行为和 W3C æ 
‡å‡†ä¸€è‡´ã€‚
-
-  可选值为:
-
-  - `stretch`:默认值,指定图片按ç…
§å®¹å™¨æ‹‰ä¼¸ï¼Œæœ‰å¯èƒ½ä½¿å›¾ç‰‡äº§ç”Ÿå½¢å˜ã€‚
-  - `cover`:指定图片可以被调整到容器,以使图片完å…
¨è¦†ç›–背景区域,图片有可能被剪裁。
-  - 
`contain`:指定可以不用考虑容器的大小,把图像扩展至最大尺寸,以使å
…¶å®½åº¦å’Œé«˜åº¦å®Œå…¨é€‚应内容区域。
-
-  例子:
-
-  ![mobile_preview](../images/image_1.jpg)
-
-- `placeholder`: <span class="api-version">v0.9+</span> &lt;string&gt; 
当源图片下载中时显示一张占位图。
-
-  [体验一下](http://dotwe.org/vue/18e71ab3484bb6751ad77ff7d5195404)
-
-## 样式
-
-- 通用样式:支持所有通用样式
-
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- `load`: <sup class="api-version">v0.8+</sup>:当图片加
载完成时触发。目前在 Android、iOS 上支持,H5 
暂不支持。[示例](http://dotwe.org/vue/e291159ac60b35dcd4994638a78d54ad)
-
-  - 事件对象
-    - `success`: 当图片成功加载时为`true`,否则为`false`
-    - `size`: 图片的原始尺寸,包含两个参数:`naturalWidth` 
代表图片的原始宽度像素值,`naturalHeight` 
代表图片的原始高度值。这两个参数的默认值都为`0`
-
-- 通用事件
-
-  支持所有通用事件:
-
-  - `click`
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-## 组件方法
-  <sup class="api-version">v0.16.0+</sup>
-  
-  - save:保存当前图片到本地
-    - 参数    
-      回调函数作为方法入参,接收保存结果.
-      ```
-       var image = this.$refs.imageRef; // image 是之前已经定义过的ref
-              image.save(function(result) {
-                      console.log(JSON.stringify(result))
-               }); 
-       ```
-    - 异步返回的数据描述
-     ```
-       {
-             "success" : true/false, // 保存成功或失败
-             "errorDesc": "errordesc" // 在success 为false的情
况会返回
-      }
-      ```
-    - 说明
-      对于 iOS 系统需要添加 
`NSPhotoLibraryAddUsageDescription`相册访问权限, iOS 11 需要再添加
一个`NSPhotoLibraryAddUsageDescription`权限, 
[查看更多iOS系统权限](https://developer.apple.com/library/content/documentation/General/Reference/InfoPlistKeyReference/Articles/CocoaKeys.html)
-      
- [试一试](http://dotwe.org/vue/fadcd44a7031943ff0feaaf1895df414)
-
-## 约束
-
-1. 需要指定宽高;
-2. 不支持子组件。
-
-## 示例
-
-```html
-<template>
-  <scroller class="wrapper" >
-    <div class="page-head" >
-      <image class="title-bg" resize="cover" 
src="https://img.alicdn.com/tps/TB1dX5NOFXXXXc6XFXXXXXXXXXX-750-202.png";></image>
-      <div class="title-box">
-        <text class="title">Alan Mathison Turing</text>
-      </div>
-    </div>
-    <div class="article">
-      <text class="paragraph">Alan Mathison Turing ( 23 June 1912 – 7 June 
1954) was an English computer scientist, mathematician, logician, cryptanalyst 
and theoretical biologist. He was highly influential in the development of 
theoretical computer science, providing a formalisation of the concepts of 
algorithm and computation with the Turing machine, which can be considered a 
model of a general purpose computer.Turing is widely considered to be the 
father of theoretical computer science and artificial intelligence.</text>
-      <text class="paragraph">During the Second World War, Turing worked for 
the Government Code and Cypher School (GC&CS) at Bletchley Park, Britain's 
codebreaking centre. For a time he led Hut 8, the section responsible for 
German naval cryptanalysis. He devised a number of techniques for speeding the 
breaking of German ciphers, including improvements to the pre-war Polish bombe 
method, an electromechanical machine that could find settings for the Enigma 
machine. Turing played a pivotal role in cracking intercepted coded messages 
that enabled the Allies to defeat the Nazis in many crucial engagements, 
including the Battle of the Atlantic; it has been estimated that this work 
shortened the war in Europe by more than two years and saved over fourteen 
million lives.</text>
-      <text class="paragraph">After the war, he worked at the National 
Physical Laboratory, where he designed the ACE, among the first designs for a 
stored-program computer. In 1948 Turing joined Max Newman's Computing Machine 
Laboratory at the Victoria University of Manchester, where he helped develop 
the Manchester computers and became interested in mathematical biology. He 
wrote a paper on the chemical basis of morphogenesis, and predicted oscillating 
chemical reactions such as the Belousov–Zhabotinsky reaction, first observed 
in the 1960s.</text>
-      <text class="paragraph">Turing was prosecuted in 1952 for homosexual 
acts, when by the Labouchere Amendment, "gross indecency" was still criminal in 
the UK. He accepted chemical castration treatment, with DES, as an alternative 
to prison. Turing died in 1954, 16 days before his 42nd birthday, from cyanide 
poisoning. An inquest determined his death as suicide, but it has been noted 
that the known evidence is also consistent with accidental poisoning. In 2009, 
following an Internet campaign, British Prime Minister Gordon Brown made an 
official public apology on behalf of the British government for "the appalling 
way he was treated." Queen Elizabeth II granted him a posthumous pardon in 
2013.</text>
-    </div>
-  </scroller>
-</template>
-
-<style>
-  .page-head {
-    width: 750px;
-    height: 200px;
-  }
-  .title-bg {
-    width: 750px;
-    height: 200px;
-  }
-  .title-box {
-    width: 750px;
-    height: 200px;
-    justify-content: center;
-    align-items: center;
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-  }
-  .title {
-    color: #ffffff;
-    font-size: 32px;
-    font-weight: bold;
-  }
-  .article {
-    padding: 20px;
-  }
-  .paragraph{
-    margin-bottom: 15px;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/e2122bc245beafb0348d79bfd1274904)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/index.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/index.md 
b/doc/source/cn/references/components/index.md
deleted file mode 100644
index 9a02e72..0000000
--- a/doc/source/cn/references/components/index.md
+++ /dev/null
@@ -1,24 +0,0 @@
----
-title: 内建组件
-type: references
-order: 2
-version: 2.1
----
-
-# 内建组件
-
-- [&lt;a&gt;](./a.html)
-- [&lt;indicator&gt;](./indicator.html)
-- [&lt;switch&gt;](./switch.html)
-- [&lt;text&gt;](./text.html)
-- [&lt;textarea&gt;](./textarea.html)
-- [&lt;video&gt;](./video.html)
-- [&lt;web&gt;](./web.html)
-- [&lt;div&gt;](./div.html)
-- [&lt;image&gt;](./image.html)
-- [&lt;input&gt;](./input.html)
-- [&lt;list&gt;](./list.html)
-- [&lt;cell&gt;](./cell.html)
-- [&lt;refresh&gt; & &lt;loading&gt;](./refresh.html)
-- [&lt;scroller&gt;](./scroller.html)
-- [&lt;slider&gt;](./slider.html)
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/indicator.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/indicator.md 
b/doc/source/cn/references/components/indicator.md
deleted file mode 100644
index aa1cab4..0000000
--- a/doc/source/cn/references/components/indicator.md
+++ /dev/null
@@ -1,136 +0,0 @@
----
-title: <indicator>
-type: references
-order: 2.11
-version: 2.1
----
-
-# &lt;indicator&gt;
-
-`<indicator>` 组件用于显示轮播图指示器效果,必须充当 
[`<slider>`](./slider.html) 组件的子组件使用。
-
-## 子组件
-
-`<indicator>` 组件没有任何子组件。
-
-## 样式
-
-`<indicator>` 组件有一些私有样式,如下:
-
-- `item-color 
{color}`:设置项的颜色,可以是颜色的名称,例如 
`red`;也可以是 16 进制的颜色,例如 `#RRGGBB`。
-
-- `item-selected-color 
{color}`:被选中时的颜色,可以是颜色的名称,`red`;也可以是
 16 进制的颜色,例如 `#RRGGBB`。
-
-- `item-size {number}`:元素的个数。
-
-- 通用样式
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-**注意 1:**
-
-这里需要注意一点,`<indicator>` 的 `position` 不仅依赖 
`top`、`left`、`bottom` 和 `right` 样式,同时会参考 `width`和 
`height` 样式。`<indicator>` 默认的宽高继承于 `<slider>`,如果 
`<slider>` 未设置宽高,需要显式的给 `<indicator>` 设置宽高值。
-
-**注意 2:**
-
-`background-color` 不推荐使用,建议使用 `item-color` 和 
`item-selected-color` 代替。
-
-
-## 事件
-
-支持所有通用事件。
-
-- `click`
-- `longpress`
-- `appear`
-- `disappear`
-
-查看 [通用事件](../common-event.html)
-
-## 约束
-
-1. 不支持子组件。
-
-## 示例
-
-```html
-<template>
-  <div>
-    <slider class="slider" interval="4500" @change="onchange">
-      <div class="frame" v-for="img in imageList">
-        <image class="image" resize="cover" :src="img.src"></image>
-        <text class="title">{{img.title}}</text>
-      </div>
-      <indicator class="indicator"></indicator>
-    </slider>
-  </div>
-</template>
-
-<style>
-  .image {
-    width: 700px;
-    height: 700px;
-  }
-  .slider {
-    margin-top: 25px;
-    margin-left: 25px;
-    width: 700px;
-    height: 700px;
-    border-width: 2px;
-    border-style: solid;
-    border-color: #41B883;
-  }
-  .title {
-    position: absolute;
-    top: 20px;
-    left: 20px;
-    padding-left: 20px;
-    width: 200px;
-    color: #FFFFFF;
-    font-size: 36px;
-    line-height: 60px;
-    background-color: rgba(0, 0, 0, 0.3);
-  }
-  .frame {
-    width: 700px;
-    height: 700px;
-    position: relative;
-  }
-  .indicator {
-    width: 700px;
-    height: 700px;
-    item-color: green;
-    item-selected-color: red;
-    item-size: 50px;
-    position: absolute;
-    top: 200px;
-    left: 200px;
-  }
-</style>
-
-<script>
-  export default {
-    data () {
-      return {
-        imageList: [
-          { title: 'item A', src: 
'https://gd2.alicdn.com/bao/uploaded/i2/T14H1LFwBcXXXXXXXX_!!0-item_pic.jpg'},
-          { title: 'item B', src: 
'https://gd1.alicdn.com/bao/uploaded/i1/TB1PXJCJFXXXXciXFXXXXXXXXXX_!!0-item_pic.jpg'},
-          { title: 'item C', src: 
'https://gd3.alicdn.com/bao/uploaded/i3/TB1x6hYLXXXXXazXVXXXXXXXXXX_!!0-item_pic.jpg'}
-        ]
-      }
-    },
-    methods: {
-      onchange (event) {
-        console.log('changed:', event.index)
-      }
-    }
-  }
-</script>
-```
-
-[try it](http://dotwe.org/vue/e1b4fd8a37ed4cafd8f5e161698754aa)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/input.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/input.md 
b/doc/source/cn/references/components/input.md
deleted file mode 100644
index 3cf83fd..0000000
--- a/doc/source/cn/references/components/input.md
+++ /dev/null
@@ -1,344 +0,0 @@
----
-title: <input>
-type: references
-order: 2.5
-version: 2.1
----
-
-# &lt;input&gt;
-
-Weex 内置的 `<input>` 组件用来创建接收用户输入字符的输å…
¥ç»„件。 `<input>` 组件的工作方式因 `type` 
属性的值而异,比如 `<text>`, `password`,`url`,`email`,`tel` 
等。
-
-**注意:** 
-
-此组件不支持 `click` 事件。请监听 `<input>` 或 `change` 
来代替 `click` 事件。
-
-## 子组件
-
-不支持子组件。
-
-## 特性
-
-- `type {string}`:控件的类型,默认值是 `<text>`。`type` 
值可以是 `text`,`password`,`url`,`email`,`tel` ,`number` 
。每个 `type` 值都符合 W3C 标准。
-- `value {string}`:组件的接收到的输入字符。
-- `placeholder {string}`:提示用户可以输入什么。 
提示文本不能有回车或换行。
-- `disabled {boolean}`:布尔类型的数据,表示是否支持输å…
¥ã€‚通常 `click` 事件在 `disabled` 控件上是失效的。
-- `autofocus {boolean}`:布尔类型的数据,表示是否在页面加
载时控件自动获得输入焦点。
-- `maxlength {nubmer}`:<sup 
class="wx-v">v0.7</sup>一个数值类型的值,表示输入的最大长度。
-- `return-key-type {string}`:<sup 
class="wx-v">v0.11</sup>键盘返回键的类型,支持 
defalut;go;next;search;send,done。
-
-## 样式
-
-- `placeholder-color {color}`:placeholder 字符颜色。默认值是 
`#999999`
-
-
-- 伪类<span class="api-version">v0.9.5+</span>: `input` 支持以下伪类:
-
-  * `active`
-  * `focus`
-  * `disabled`
-  * `enabled`
-
-- text styles
-  - 支持 `color`
-  - 支持 `font-size`
-  - 支持 `font-style`
-  - 支持 `font-weight`
-  - 支持 `text-align`
-
-  查看 [文本样式](../text-style.html)
-
-- 通用样式:支持所有通用样式
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- `input`: 输入字符的值更改。
-
-  事件中 event 对象属性:
-
-  - `value`: 触发事件的组件;
-  - `timestamp`: 事件发生时的时间戳,仅支持Android。
-
-- `change`: 当用户输入完成时触发。通常在 `blur` 事件之后。
-
-  事件中 event 对象属性:
-
-  - `value`: 触发事件的组件;
-
-  - `timestamp`: 事件发生时的时间戳,仅支持Android。
-
-- `focus`: 组件获得输入焦点。
-
-  事件中 event 对象属性:
-
-  - `timestamp`: 事件发生时的时间戳,仅支持Android。
-
-- `blur`: 组件失去输入焦点。
-
-  事件中 event 对象属性:
-
-  - `timestamp`: 事件发生时的时间戳,仅支持Android。
-- `return`: 键盘点击返回键。
-
-    事件中 event 对象属性:
-
-    - `returnKeyType`: 事件发生时的返回键类型。
-    - `value`: 触发事件的组件的文本;
-
-- 通用事件
-
-  **注意:**
-  不支持 `click` 事件。 请监听 `input` 或 `change` 事件代替。
-
-  支持以下通用事件:
-
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-
-
-## Methods
-
-- `focus()` <span class="api-version">v0.9+</span>
-
-  `focus()` 方法用于将 `input` 组件聚焦。
-
-- `blur()` <span class="api-version">v0.9+</span>
-
-  `blur()` 方法用于从 `input` 组件中移除焦点并å…
³é—­è½¯é”®ç›˜ï¼ˆå¦‚果它具有焦点)。
-- `setSelectionRange(selectionStart,selectionEnd)`  <span 
class="api-version">v0.11+</span>设置文本选区
-  - `selectionStart {number}`:设置文本选区的起始点
-  - `selectionEnd {number}`:设置文本选区的起终点
-- `getEditSelectionRange(callback[selectionStart,selectionEnd])`  <span 
class="api-version">v0.11+</span>设置文本选区
-    - `selectionStart {number}`:获取文本选区的起始点
-    - `selectionEnd {number}`:获取文本选区的起终点
-## 约束
-
-目前不支持 `this.$el(id).value = ''` 这种方式改写 input 
value。只支持在 `<input>` 组件的 `input`、`change` 事件中改写。
-
-## 示例
-
-```html
-<template>
-  <div>
-    <div>
-      <text style="font-size: 40px">oninput: {{txtInput}}</text>
-      <text style="font-size: 40px">onchange: {{txtChange}}</text>
-      <text style="font-size: 40px">onreturntype: {{txtReturnType}}</text>
-      <text style="font-size: 40px">selection: {{txtSelection}}</text>
-
-    </div>
-    <scroller>
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input type = text</text>
-        </div>
-        <input type="text" placeholder="Input Text" class="input" 
:autofocus=true value="" @change="onchange" @input="oninput"/>
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input type = password</text>
-        </div>
-        <input type="password" placeholder="Input Password" class="input" 
@change="onchange" @input="oninput"/>
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input type = url</text>
-        </div>
-        <input type="url" placeholder="Input URL" class="input" 
@change="onchange" @input="oninput"/>
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input type = email</text>
-        </div>
-        <input type="email" placeholder="Input Email" class="input" 
@change="onchange" @input="oninput"/>
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input type = tel</text>
-        </div>
-        <input type="tel" placeholder="Input Tel" class="input" 
@change="onchange" @input="oninput"/>
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input type = time</text>
-        </div>
-        <input type="time" placeholder="Input Time" class="input" 
@change="onchange" @input="oninput"/>
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input type = number</text>
-        </div>
-        <input type="number" placeholder="Input number" class="input" 
@change="onchange" @input="oninput"/>
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input type = date</text>
-        </div>
-        <input type="date" placeholder="Input Date" class="input" 
@change="onchange" @input="oninput" max="2017-12-12" min="2015-01-01"/>
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input return-key-type = default</text>
-        </div>
-        <input type="text" placeholder="please input" 
return-key-type="default" class="input" @change="onchange" @return = "onreturn" 
@input="oninput" />
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input return-key-type = go</text>
-        </div>
-        <input type="text" placeholder="please input" return-key-type="go" 
class="input" @change="onchange" @return = "onreturn" @input="oninput" />
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input return-key-type = next</text>
-        </div>
-        <input type="text" placeholder="please input" return-key-type="next" 
class="input" @change="onchange" @return = "onreturn" @input="oninput" />
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input return-key-type = search</text>
-        </div>
-        <input type="text" placeholder="please input" return-key-type="search" 
class="input" @change="onchange" @return = "onreturn" @input="oninput" />
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input return-key-type = send</text>
-        </div>
-        <input type="text" placeholder="please input" return-key-type="send" 
class="input" @change="onchange" @return = "onreturn" @input="oninput" />
-      </div>
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input return-key-type = done</text>
-        </div>
-        <input type="text" placeholder="please input" return-key-type="done" 
class="input" @change="onchange" @return = "onreturn" @input="oninput" />
-      </div>
-
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">function focus() & blur()</text>
-        </div>
-        <div style="flex-direction: row;margin-bottom: 16px;justify-content: 
space-between">
-          <text class="button" value="Focus" type="primary" 
@click="focus"></text>
-          <text class="button" value="Blur" type="primary" 
@click="blur"></text>
-        </div>
-
-        <input type="text" placeholder="Input1" class="input" value="" 
ref="input1"/>
-      </div>
-
-
-      <div>
-        <div style="background-color: #286090">
-          <text class="title" style="height: 80 ;padding: 20;color: 
#FFFFFF">input selection</text>
-        </div>
-        <div style="flex-direction: row;margin-bottom: 16px;justify-content: 
space-between">
-          <text class="button" value="setRange" type="primary" 
@click="setRange"></text>
-          <text class="button" value="getSelectionRange" type="primary" 
@click="getSelectionRange"></text>
-        </div>
-        <input type="text"  ref="inputselection" placeholder="please input" 
value="123456789"  class="input" @change="onchange" @return = "onreturn" 
@input="oninput"/>
-      </div>
-
-
-
-    </scroller>
-  </div>
-</template>
-
-<style scoped>
-  .input {
-    font-size: 60px;
-    height: 80px;
-    width: 750px;
-  }
-  .button {
-    font-size: 36;
-    width: 200;
-    color: #41B883;
-    text-align: center;
-    padding-top: 10;
-    padding-bottom: 10;
-    border-width: 2;
-    border-style: solid;
-    margin-right: 20;
-    border-color: rgb(162, 217, 192);
-    background-color: rgba(162, 217, 192, 0.2);
-  }
-</style>
-
-<script>
-  module.exports = {
-    data: function () {
-      return {
-        txtInput: '',
-        txtChange: '',
-        txtReturnType: '',
-        txtSelection:'',
-        autofocus: false
-      };
-    },
-    methods: {
-      ready: function () {
-        var self = this;
-        setTimeout(function () {
-          self.autofocus = true;
-        }, 1000);
-      },
-      onchange: function (event) {
-        this.txtChange = event.value;
-        console.log('onchange', event.value);
-      },
-      onreturn: function (event) {
-        this.txtReturnType = event.returnKeyType;
-        console.log('onreturn', event.type);
-      },
-      oninput: function (event) {
-        this.txtInput = event.value;
-        console.log('oninput', event.value);
-      },
-      focus: function () {
-        this.$refs['input1'].focus();
-      },
-      blur: function () {
-        this.$refs['input1'].blur();
-      },
-      setRange: function() {
-        console.log(this.$refs["inputselection"]);
-        this.$refs["inputselection"].setSelectionRange(2, 6);
-      },
-      getSelectionRange: function() {
-        console.log(this.$refs["inputselection"]);
-        var self = this;
-        this.$refs["inputselection"].getSelectionRange(function(e) {
-          self.txtSelection = e.selectionStart +'-' + e.selectionEnd;
-        });
-      }
-    }
-  };
-</script>
-```
-
-[体验一下](http://dotwe.org/vue/3470e4d0194f3879a72d38e2ab02cc9f)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/list.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/list.md 
b/doc/source/cn/references/components/list.md
deleted file mode 100644
index 8e1e63c..0000000
--- a/doc/source/cn/references/components/list.md
+++ /dev/null
@@ -1,172 +0,0 @@
----
-title: <list>
-type: references
-order: 2.5
-version: 2.1
----
-
-# &lt;list&gt;
-
-`<list>` 组件是提供垂直列表功能的æ 
¸å¿ƒç»„件,拥有平滑的滚动和高效的内
存管理,非常适合用于长列表的展示。最简单的使用方法是在
 `<list>` 标签内使用一组由简单数组 `repeat` 生成的 `<cell>` æ 
‡ç­¾å¡«å……。
-
-## 子组件
-
-`<list>` 组件支持更多高级功能,由以下子组件提供:
-
-- `<cell>`
-
-  用于定义列表中的子列表项,类似于 HTML 中的 `ul` 之于 
`li`。Weex 会对 `<cell>` 进行高效的内
存回收以达到更好的性能。
-
-  使用文档请查看 [`<cell>`](./cell.html)。
-
-- `header` <sup class="wx-v">0.6.1+</sup>
-
-  当 `<header>` 到达屏幕顶部时,吸附在屏幕顶部。
-
-- `<refresh>`
-
-  用于给列表添加下拉刷新的功能。
-
-  使用文档请查看 [`<refresh>`](./refresh.html)
-
-- `<loading>`
-
-  `<loading>` 用法与特性和 `<refresh>` 类似,用于给列表添加
上拉加载更多的功能。
-
-  使用文档请查看 [`<loading>`](./loading.html)
-
-**注意:**
-
-`<list>` 的子组件只能包括以上四种组件或是 `fix` 
定位的组件,其他形式的组件将不能被正确的渲染。
-
-## 特性
-
-- `loadmoreoffset {number}`:默认值为 0,触发 `loadmore` 
事件所需要的垂直偏移距离(设备屏幕底部与 `<list>` 
底部之间的距离)。当 `<list>` 的滚动条滚动到足够接近 
`<list>` 底部时将会触发 `loadmore` 这个事件。
-- `offset-accuracy {number}` <sup 
class="wx-v">0.11+</sup>:控制`onscroll`事件触发的频率,默认值为10,表示两次`onscroll`事件之间列表至少滚动了10px。注意,将该值设置为较小的数值会提高滚动事件采æ
 ·çš„精度,但同时也会降低页面的性能。
-
-  ![mobile_preview](../images/list_4.jpg)
-
-- `offset-accuracy`:默认值是0,触发 `scroll` 
事件所需要的垂直偏移距离。
-## 样式
-
-- 通用样式:支持所有通用样式
-
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- `loadmore` <sup 
class="wx-v">0.5+</sup>:如果列表滚动到底部将会立即触发这个事件,ä½
 å¯ä»¥åœ¨è¿™ä¸ªäº‹ä»¶çš„处理函数中加载下一页的列表项。
-- `scroll` <sup class="wx-v">0.11+</sup>: 
列表发生滚动时将会触发该事件,事件的默认抽æ 
·çŽ‡ä¸º10px,即列表每滚动10px触发一次,可通过属性`offset-accuracy`设置抽æ
 ·çŽ‡ã€‚    
-
-  事件中 event 对象属性:
-  - `contentSize {Object}`:列表的内容尺寸
-    - `width {number}`: 列表内容宽度
-    - `height {number}`: 列表内容高度
-  - `contentOffset {Object}`: 列表的偏移尺寸
-    - `x {number}`: x轴上的偏移量
-    - `y {number}`: y轴上的偏移量
-
-  [体验一下](http://dotwe.org/bc445ede8746a31360e3607d210304c5)
-
-- 通用事件
-
-  支持所有通用事件:
-
-  - `click`
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-## 扩展
-
-### scrollToElement(node, options)
-
-滚动到列表某个指定项是常见需求,`<list>` 
拓展了该功能支持滚动到指定 `<cell>`。通过 `dom` module 
访问,更多信息可参考 [dom module](../modules/dom.html) 。
-
-### resetLoadmore() <sup class="wx-v">0.9+</sup>
-在默认情况下,触发`loadmore`事件后,如果列表中内
容没有发生变更,则下一次滚动到列表末尾时将不会再次触发`loadmore`事件,ä½
 å¯ä»¥é€šè¿‡è°ƒç”¨`resetLoadmore()`方法来打ç 
´è¿™ä¸€é™åˆ¶ï¼Œè°ƒç”¨è¯¥æ–¹æ³•åŽï¼Œä¸‹ä¸€æ¬¡æ»šåŠ¨åˆ°åˆ—表末尾时将强制触发`loadmore`。
-
-#### 参数
-
-- `node {node}`:指定目标节点。
-- `options {Object}`:
-  - `offset {number}`:一个到其可见位置的偏移距离,默认是 0
-
-## 约束
-
-1. **不允许**相同方向的 `<list>` 或者 `<scroller>` 
互相嵌套,换句话说就是嵌套的 `<list>`/`<scroller>` 必
须是不同的方向。
-
-  举个例子,**不允许**一个垂直方向的 `<list>` 
嵌套的一个垂直方向的 `<scroller>` 中,但是一个垂直方向的 
`<list>` 是可以嵌套的一个水平方向的 list 或者 `<scroller>` 
中的。
-
-2. `<list>` 为根节点时无需设置高度,但是内嵌 `<list>` 
高度**必须可计算**,你可以使用 `flex` 或 `postion` 将 `<list>` 
设为一个响应式高度(例如全屏显示), 也可以显式设置 
`<list>` 组件的 `height` 样式。
-
-## 示例
-
-
-```html
-<template>
-  <list class="list" @loadmore="fetch" loadmoreoffset="10">
-    <cell class="cell" v-for="num in lists">
-      <div class="panel">
-        <text class="text">{{num}}</text>
-      </div>
-    </cell>
-  </list>
-</template>
-
-<script>
-  const modal = weex.requireModule('modal')
-  const LOADMORE_COUNT = 4
-
-  export default {
-    data () {
-      return {
-        lists: [1, 2, 3, 4, 5]
-      }
-    },
-    methods: {
-      fetch (event) {
-        modal.toast({ message: 'loadmore', duration: 1 })
-
-        setTimeout(() => {
-          const length = this.lists.length
-          for (let i = length; i < length + LOADMORE_COUNT; ++i) {
-            this.lists.push(i + 1)
-          }
-        }, 800)
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  .panel {
-    width: 600px;
-    height: 250px;
-    margin-left: 75px;
-    margin-top: 35px;
-    margin-bottom: 35px;
-    flex-direction: column;
-    justify-content: center;
-    border-width: 2px;
-    border-style: solid;
-    border-color: rgb(162, 217, 192);
-    background-color: rgba(162, 217, 192, 0.2);
-  }
-  .text {
-    font-size: 50px;
-    text-align: center;
-    color: #41B883;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/d31c85e7cd2dc54fa098e920a5376c38)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/loading.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/loading.md 
b/doc/source/cn/references/components/loading.md
deleted file mode 100644
index cd630c3..0000000
--- a/doc/source/cn/references/components/loading.md
+++ /dev/null
@@ -1,127 +0,0 @@
----
-title: <loading>
-type: references
-order: 2.7
-version: 2.1
----
-
-# &lt;loading&gt;
-
-<span class="weex-version">v0.6.1+</span>
-
-`<loading>` 为 `<scroller>` 和 `<list>` 提供上拉加
载功能。用法与特性与 `<refresh>` 类似, 是 `<scroller>` 和 
`<list>` 的子组件,且只能在被 `<scroller>` 和 `<list>` 包
含时才能被正确的渲染。
-
-## 子组件
-
-- [`<text>`](./text.html)
-- [`<image>`](./image.html)
-- `<loading-indicator>`: `<refresh>` 和 `<loading>` 
组件的子组件,拥有默认的动画效果的实现。
-
-## 特性
-
-- `display {string}`:可选值为 `show` 或者 `hide`,仅隐藏 
`<indicator>`,`<loading>` 其他子组件依然可见,`loading` 
事件仍会被触发。
-
-## 样式
-
-支持所有通用样式。
-
-- 盒模型
-- `flexbox` 布局
-- `position`
-- `opacity`
-- `background-color`
-
-查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- `loading`:加载时被触发。
-
-## 约束
-
-- `<loading>` 不支持 `remove`,v0.9 版本会修复。
-- `display` 值为 `show` 或 `hide`。仅隐藏 `<indicator>`,`<loading>` å…
¶ä»–子组件依然可见,`loading` 事件仍会被触发。
-
-  如果需要 `<loading>` hide 
时隐藏文案并不再触发事件,有两种解决方法:
-
-  1. 修改提示文案,并在 `loading` 事件中添加判断逻辑;
-  2. v0.9+ 可通过 `remove` 解决。
-
-- 只能通过 `display` 特性进行展示和隐藏,且必
须成对出现,即设置 `display="show"`,必须有对应的 
`display="hide"`。
-
-## 示例
-
-```html
-<template>
-  <scroller class="scroller">
-    <div class="cell" v-for="num in lists">
-      <div class="panel">
-        <text class="text">{{num}}</text>
-      </div>
-    </div>
-    <loading class="loading" @loading="onloading" :display="showLoading">
-      <text class="indicator">Loading ...</text>
-    </loading>
-  </scroller>
-</template>
-
-<script>
-  const modal = weex.requireModule('modal')
-  const LOADMORE_COUNT = 4
-
-  export default {
-    data () {
-      return {
-        showLoading: 'hide',
-        lists: [1, 2, 3, 4, 5]
-      }
-    },
-    methods: {
-      onloading (event) {
-        modal.toast({ message: 'loading', duration: 1 })
-        this.showLoading = 'show'
-        setTimeout(() => {
-          const length = this.lists.length
-          for (let i = length; i < length + LOADMORE_COUNT; ++i) {
-            this.lists.push(i + 1)
-          }
-          this.showLoading = 'hide'
-        }, 1500)
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  .panel {
-    width: 600px;
-    height: 250px;
-    margin-left: 75px;
-    margin-top: 35px;
-    margin-bottom: 35px;
-    flex-direction: column;
-    justify-content: center;
-    border-width: 2px;
-    border-style: solid;
-    border-color: #DDDDDD;
-    background-color: #F5F5F5;
-  }
-  .text {
-    font-size: 50px;
-    text-align: center;
-    color: #41B883;
-  }
-  .loading {
-    justify-content: center;
-  }
-  .indicator {
-    color: #888888;
-    font-size: 42px;
-    padding-top: 20px;
-    padding-bottom: 20px;
-    text-align: center;
-  }
-</style>
-```
-
-[Try it](http://dotwe.org/vue/d5c1b2336a703a6e6e47c303af41ffcd)
\ No newline at end of file

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/refresh.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/refresh.md 
b/doc/source/cn/references/components/refresh.md
deleted file mode 100644
index 24a5823..0000000
--- a/doc/source/cn/references/components/refresh.md
+++ /dev/null
@@ -1,132 +0,0 @@
----
-title: <refresh>
-type: references
-order: 2.8
-version: 2.1
----
-
-# &lt;refresh&gt;
-
-<span class="weex-version">v0.6.1+</span>
-
-`<refresh>` 为 `<scroller>` 和 `<list>` 提供下拉加
载功能。用法与特性与 `<loading>` 类似,`<scroller>` 和 `<list>` 
的子组件,且只能在被 `<scroller>` 和 `<list>` 包
含时才能被正确的渲染。
-
-## 子组件
-
-- [`<text>`](./text.html)
-- [`<image>`](./image.html)
-- `<loading-indicator>`: `<refresh>` 和 `<loading>` 
组件的子组件,拥有默认的动画效果的实现。
-
-## 特性
-
-- `display {string}`:可选值为 `show` 或者 `hide`,仅隐藏 
`<indicator>`,`<refresh>` 其他子组件依然可见,`<refresh>` 
事件仍会被触发。
-
-## 样式
-
-支持所有通用样式。
-
-- 盒模型
-- `flexbox` 布局
-- `position`
-- `opacity`
-- `background-color`
-
-查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- `refresh`: 当 `<scroller>`/`<list>` 被下拉时触发。
-- `pullingdown`<span class="weex-version">v0.6.1+</span>: 当 
`<scroller>`/`<list>` 
被下拉时触发,可以从事件的参数对象中获取 
dy,pullingDistance, viewHeight, type
-
-  ```
-  dy: 前后两次回调滑动距离的差值
-  pullingDistance: 下拉的距离
-  viewHeight: refreshView 高度
-  type: "pullingdown" 常数字符串
-  ```
-
-## 约束
-
-- `<refresh>` 不支持 `remove`,v0.9 版本会修复。
-- `display` 值为 `show` 或 `hide`。仅隐藏 `<indicator>`,`<refresh>` å…
¶ä»–子组件依然可见,`refresh` 事件仍会被触发。
-
-  如果需要 `<refresh>` hide 
时隐藏文案并不再触发事件,有两种解决方法:
-
-  1. 修改提示文案,并在 `refresh` 事件中添加判断逻辑;
-  2. v0.9+ 可通过 `remove` 解决。
-
-- 只能通过 `display` 特性进行展示和隐藏,且必
须成对出现,即设置 `display="show"`,必须有对应的 
`display="hide"`。
-
-## 示例
-
-```html
-<template>
-  <scroller class="scroller">
-    <refresh class="refresh" @refresh="onrefresh" @pullingdown="onpullingdown" 
:display="refreshing ? 'show' : 'hide'">
-      <text class="indicator">Refreshing ...</text>
-    </refresh>
-    <div class="cell" v-for="num in lists">
-      <div class="panel">
-        <text class="text">{{num}}</text>
-      </div>
-    </div>
-  </scroller>
-</template>
-
-<script>
-  const modal = weex.requireModule('modal')
-
-  export default {
-    data () {
-      return {
-        refreshing: false,
-        lists: [1, 2, 3, 4, 5]
-      }
-    },
-    methods: {
-      onrefresh (event) {
-        console.log('is refreshing')
-        modal.toast({ message: 'refresh', duration: 1 })
-        this.refreshing = true
-        setTimeout(() => {
-          this.refreshing = false
-        }, 2000)
-      },
-      onpullingdown (event) {
-        console.log('is onpulling down')
-        modal.toast({ message: 'pulling down', duration: 1 })
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  .indicator {
-    color: #888888;
-    font-size: 42px;
-    text-align: center;
-  }
-  .panel {
-    width: 600px;
-    height: 250px;
-    margin-left: 75px;
-    margin-top: 35px;
-    margin-bottom: 35px;
-    flex-direction: column;
-    justify-content: center;
-    border-width: 2px;
-    border-style: solid;
-    border-color: #DDDDDD;
-    background-color: #F5F5F5;
-  }
-  .text {
-    font-size: 50px;
-    text-align: center;
-    color: #41B883;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/d3db5f344220a6339de044a5e33c502b)
-
-更多示例可查看 [`<list>`](./list.html)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/scroller.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/scroller.md 
b/doc/source/cn/references/components/scroller.md
deleted file mode 100644
index 69c7d5d..0000000
--- a/doc/source/cn/references/components/scroller.md
+++ /dev/null
@@ -1,199 +0,0 @@
----
-title: <scroller>
-type: references
-order: 2.9
-version: 2.1
----
-
-# &lt;scroller&gt;
-
-<span class="weex-version">v0.6.1+</span>
-
-`<scroller>` 
是一个竖直的,可以容纳多个排成一列的子组件的滚动器。如果子组件的总高度高于å
…¶æœ¬èº«ï¼Œé‚£ä¹ˆæ‰€æœ‰çš„子组件都可滚动。
-
-**注意:** `<scroller>` 可以当作根元素或者嵌套元素
使用。此组件的滚动方向是垂直方向的形式。
-
-## 子组件
-
-支持任意类型的 Weex 组件作为其子组件。 å…
¶ä¸­ï¼Œè¿˜æ”¯æŒä»¥ä¸‹ä¸¤ä¸ªç‰¹æ®Šç»„件作为子组件:
-
-- `<refresh>`
-
-  用于给列表添加下拉刷新的功能。
-
-  使用文档请查看 [`<refresh>`](./refresh.html)
-
-- `<loading>`
-
-  `<loading>` 用法与特性和 `<refresh>` 类似,用于给列表添加
上拉加载更多的功能。
-
-  使用文档请查看 [`<loading>`](./loading.html)
-
-## 特性
-
-- `show-scrollbar {boolean}`:可选值为 `true`/ `false`,默认值为 
`true`。控制是否出现滚动条。
-
-- `scroll-direction {string}`:可选为 `horizontal` 或者 
`vertical`,默认值为 `vertical` 。定义滚动的方向。
-  - `scroll-direction`定义了 scroller 的滚动方向,`flex-direction` 
定义了 scroller 的布局方向,两个方向必须一致。
-  - `scroll-direction` 的默认值是 `vertical`, `flex-direction` 
的默认值是 `row`。
-  - 当需要一个水平方向的 scroller 时,使用 
`scroll-direction:horizontal` 和 `flex-direction: row`。
-  - 当需要一个竖直方向的 scroller 时,使用 
`scroll-direction:vertical` 和 `flex-direction: 
column`。由于这两个值均是默认值,当需要一个竖直方向的 
scroller 时,这两个值可以不设置。
-- `loadmoreoffset {number}`:默认值为 0,触发 `loadmore` 
事件所需要的垂直偏移距离(设备屏幕底部与页面底部之间的距离)。当页面的滚动条滚动到足够接近页面底部时将会触发
 `loadmore` 这个事件。
-
-  ![mobile_preview](../images/scroller_1.jpg)
-
-- ~~`loadmoreretry {number}`:默认值为 0,当 `loadmore` 
失败时是否重置 `loadmore` 相关的 UI,值不一样就会重置。~~ 
该属性已废弃,请使用`resetLoadmore()`函数实现重置`loadmore`的操作。
-- `offset-accuracy {number}` <sup 
class="wx-v">0.11+</sup>:控制`onscroll`事件触发的频率,默认值为10,表示两次`onscroll`事件之间列表至少滚动了10px。注意,将该值设置为较小的数值会提高滚动事件采æ
 ·çš„精度,但同时也会降低页面的性能。
-
-- `offset-accuracy`:默认值是0,触发 `scroll` 
事件所需要的垂直偏移距离。
-
-## 样式
-
-- 通用样式:支持所有通用样式
-
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- `loadmore` <sup 
class="wx-v">v0.5+</sup>:如果滚动到底部将会立即触发这个事件,ä½
 å¯ä»¥åœ¨è¿™ä¸ªäº‹ä»¶çš„处理函数中加载下一页的列表项。
-- `scroll` <sup class="wx-v">0.11+</sup>: 
列表发生滚动时将会触发该事件,事件的默认抽æ 
·çŽ‡ä¸º10px,即列表每滚动10px触发一次,可通过属性`offset-accuracy`设置抽æ
 ·çŽ‡ã€‚    参见 [scroll event 
demo](http://dotwe.org/vue/9ef0e52bacaa20182a693f2187d851aa)。 
-
-  事件中 event 对象属性:
-  - `contentSize {Object}`:列表的内容尺寸
-    - `width {number}`: 列表内容宽度
-    - `height {number}`: 列表内容高度
-  - `contentOffset {Object}`: 列表的偏移尺寸
-    - `x {number}`: x轴上的偏移量
-    - `y {number}`: y轴上的偏移量
-
-- `scrollstart` <sup 
class="wx-v">v0.17+</sup>:列表刚开始发生滚动的时候会触发该事件,可以在此执行滚动开始的逻辑。
-
-- `scrollend` <sup 
class="wx-v">v0.17+</sup>:列表结束滚动的时候会触发该事件,可以在此执行滚动结束的逻辑。
-
-- 通用事件
-
-  支持所有通用事件:
-
-  - `click`
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-## 扩展
-
-### scrollToElement(node, options)
-
-滚动到列表某个指定项是常见需求,`<list>` 
拓展了该功能支持滚动到指定 `<cell>`。通过 `dom` module 
访问,更多信息可参考 [dom module](../modules/dom.html) 。
-
-### resetLoadmore() <sup class="wx-v">0.9+</sup>
-在默认情况下,触发`loadmore`事件后,如果列表中内
容没有发生变更,则下一次滚动到列表末尾时将不会再次触发`loadmore`事件,ä½
 å¯ä»¥é€šè¿‡è°ƒç”¨`resetLoadmore()`方法来打ç 
´è¿™ä¸€é™åˆ¶ï¼Œè°ƒç”¨è¯¥æ–¹æ³•åŽï¼Œä¸‹ä¸€æ¬¡æ»šåŠ¨åˆ°åˆ—表末尾时将强制触发`loadmore`。
-
-#### 参数
-
-- `node {node}`:指定目标节点。
-- `options {Object}`:
-    - `offset {number}`:一个到其可见位置的偏移距离,默认是0
-
-## 约束
-
-**不允许**相同方向的 `<list>` 或者 `<scroller>` 
互相嵌套,换句话说就是嵌套的 `<list>`/`<scroller>` 必
须是不同的方向。
-
-举个例子,**不允许**一个垂直方向的 `<list>` 
嵌套的一个垂直方向的 `<scroller>` 中,但是一个垂直方向的 
`<list>` 是可以嵌套的一个水平方向的 `<list>` 或者 `<scroller>` 
中的。
-
-## 示例
-
-```html
-<template>
-  <div class="wrapper">
-    <scroller class="scroller">
-      <div class="row" v-for="(name, index) in rows" :ref="'item'+index">
-        <text class="text" :ref="'text'+index">{{name}}</text>
-      </div>
-    </scroller>
-    <div class="group">
-      <text @click="goto10" class="button">Go to 10</text>
-      <text @click="goto20" class="button">Go to 20</text>
-    </div>
-  </div>
-</template>
-
-<script>
-  const dom = weex.requireModule('dom')
-
-  export default {
-    data () {
-      return {
-        rows: []
-      }
-    },
-    created () {
-      for (let i = 0; i < 30; i++) {
-        this.rows.push('row ' + i)
-      }
-    },
-    methods: {
-      goto10 (count) {
-        const el = this.$refs.item10[0]
-        dom.scrollToElement(el, {})
-      },
-      goto20 (count) {
-        const el = this.$refs.item20[0]
-        dom.scrollToElement(el, { offset: 0 })
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  .scroller {
-    width: 700px;
-    height: 700px;
-    border-width: 3px;
-    border-style: solid;
-    border-color: rgb(162, 217, 192);
-    margin-left: 25px;
-  }
-  .row {
-    height: 100px;
-    flex-direction: column;
-    justify-content: center;
-    padding-left: 30px;
-    border-bottom-width: 2px;
-    border-bottom-style: solid;
-    border-bottom-color: #DDDDDD;
-  }
-  .text {
-    font-size: 45px;
-    color: #666666;
-  }
-  .group {
-    flex-direction: row;
-    justify-content: center;
-    margin-top: 60px;
-  }
-  .button {
-    width: 200px;
-    padding-top: 20px;
-    padding-bottom: 20px;
-    font-size: 40px;
-    margin-left: 30px;
-    margin-right: 30px;
-    text-align: center;
-    color: #41B883;
-    border-width: 2px;
-    border-style: solid;
-    border-color: rgb(162, 217, 192);
-    background-color: rgba(162, 217, 192, 0.2);
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/2f22f14fb711d88515e63c3f67bed46a)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/slider.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/slider.md 
b/doc/source/cn/references/components/slider.md
deleted file mode 100644
index 0a23c2e..0000000
--- a/doc/source/cn/references/components/slider.md
+++ /dev/null
@@ -1,112 +0,0 @@
----
-title: <slider>
-type: references
-order: 2.11
-version: 2.1
----
-
-# &lt;slider&gt;
-
-`<slider>` 
组件用于在一个页面中展示多个图片,在前端,这种效果被称为
 `轮播图`。
-
-## 子组件
-
-支持任意类型的 Weex 组件作为其子组件。 å…
¶ä¸­ï¼Œè¿˜æ”¯æŒä»¥ä¸‹ç»„件作为子组件展示特殊效果:
-
-- `<indicator>`:用于显示轮播图指示器效果,必须充当 
[`<slider>`](./slider.html) 组件的子组件使用。
-
-## 特性
-
-- `auto-play {boolean}`:可选值为 `true`/`false`,默认的是 `false`。
-
-  该值决定是否自动播放轮播。重置 `loadmore` 相关的 
UI,值不一样就会重置。
-
-- `interval {number}`:值为毫秒数,此值设定 slider 
切换时间间隔。当 `auto-play` 值为 `true` 时生效。
-- `infinite {boolean}`:循环播放,可选值为 
`true`/`false`,默认的是 `true`。
-- `offset-x-accuracy {number}`<sup 
class="wx-v">0.11+</sup>:控制`onscroll`事件触发的频率,默认值为10,表示两次`onscroll`事件之间Slider
 
Page至少滚动了10px。注意,将该值设置为较小的数值会提高滚动事件采æ
 ·çš„精度,但同时也会降低页面的性能。
-
-## 样式
-
-- 通用样式:支持所有通用样式
-
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- `change`: 当轮播索引改变时,触发该事件。
-
-  事件中 event 对象属性:
-  - `index`:展示的图片索引
-  - `scroll` <sup class="wx-v">0.11+</sup>: 
列表发生滚动时将会触发该事件,事件的默认抽æ 
·çŽ‡ä¸º10px,即列表每滚动10px触发一次,可通过属性`offset-accuracy`设置抽æ
 ·çŽ‡ã€‚    
-  [体验一下](http://dotwe.org/vue/832e8f50cc325975b9d3aba93a9f6c39)
-  事件中 event 对象属性:  
-  - `offsetXRatio 
{number}`:表示当前页面的偏移比例,取值范围为[-1, 
1],负值表示向左侧滚动,正值向右。例如,`-0.2`表示当前item有20%的区域被滚动到slider左侧边界以外,`0.3`表示当前item有30%的区域被滚动到slider右侧边界以外。
-
-
-- 通用事件
-
-  支持所有通用事件:
-
-  - `click`
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-## 示例
-
-```html
-<template>
-  <div>
-    <slider class="slider" interval="3000" auto-play="true">
-      <div class="frame" v-for="img in imageList">
-        <image class="image" resize="cover" :src="img.src"></image>
-      </div>
-    </slider>
-  </div>
-</template>
-
-<style scoped>
-  .image {
-    width: 700px;
-    height: 700px;
-  }
-  .slider {
-    margin-top: 25px;
-    margin-left: 25px;
-    width: 700px;
-    height: 700px;
-    border-width: 2px;
-    border-style: solid;
-    border-color: #41B883;
-  }
-  .frame {
-    width: 700px;
-    height: 700px;
-    position: relative;
-  }
-</style>
-
-<script>
-  export default {
-    data () {
-      return {
-        imageList: [
-          { src: 
'https://gd2.alicdn.com/bao/uploaded/i2/T14H1LFwBcXXXXXXXX_!!0-item_pic.jpg'},
-          { src: 
'https://gd1.alicdn.com/bao/uploaded/i1/TB1PXJCJFXXXXciXFXXXXXXXXXX_!!0-item_pic.jpg'},
-          { src: 
'https://gd3.alicdn.com/bao/uploaded/i3/TB1x6hYLXXXXXazXVXXXXXXXXXX_!!0-item_pic.jpg'}
-        ]
-      }
-    }
-  }
-</script>
-```
-
-[try it](http://dotwe.org/vue/0c43ffd743c90b3bd9f5371062652e60)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/switch.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/switch.md 
b/doc/source/cn/references/components/switch.md
deleted file mode 100644
index 42b24d9..0000000
--- a/doc/source/cn/references/components/switch.md
+++ /dev/null
@@ -1,133 +0,0 @@
----
-title: <switch>
-type: references
-order: 2.12
-version: 2.1
----
-
-# &lt;switch&gt;
-
-<span class="weex-version">v0.6.1+</span>
-
-`<switch>` 是 Weex 的内置组件,用来创建与 iOS 一致æ 
·å¼çš„按钮。例如,在 iPhone 
中的设置应用中的飞行模式按钮就是一个 switch 按钮。
-
-## 子组件
-
-`<switch>` 组件**不支持**任何子组件。
-
-## 特性
-
-- `checked {boolean}`:默认值为 `false`,表明按钮是否开启 is on 
or not.
-- `disabled {boolean}`:默认值为 `false`,表明是否激活按钮
-
-## 样式
-
-值得注意的是,在这个组件上,有些æ 
·å¼ç»„件属性**不能使用**,它们是:
-
-- `width`
-- `height`
-- `min-width`
-- `min-height`
-- `margin`
-- `padding`
-- `border`
-
-**注意:**
-
-如果 `<switch>` 的容器没有设置为 `align-items:flex-start`,则 
Android 中的开关将被拉伸。
-
-- 通用样式
-
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- `change`:改变开关状态时触发该事件。
-
-  事件中 event 对象属性:
-
-  - `value`: 组件布尔值真或假。
-  - `timestamp`: 事件的时间戳。
-
-- 通用事件
-
-  支持所有通用事件:
-
-  - `click`
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-## 示例
-
-```html
-<template>
-  <div>
-    <div class="example">
-      <text class="label">normal</text>
-      <switch></switch>
-    </div>
-    <div class="example">
-      <text class="label">checked</text>
-      <switch checked="true"></switch>
-    </div>
-    <div class="example">
-      <text class="label">disabled</text>
-      <switch disabled="true" checked="true"></switch>
-      <switch disabled="true"></switch>
-    </div>
-    <div class="example">
-      <text class="label">onchange</text>
-      <switch @change="onchange"></switch>
-      <text class="info">{{checked}}</text>
-    </div>
-  </div>
-</template>
-
-<script>
-  export default {
-    data () {
-      return {
-        checked: false
-      }
-    },
-    methods: {
-      onchange (event) {
-        console.log(`onchage, value: ${event.value}`)
-        this.checked = event.value
-      }
-    }
-  }
-</script>
-
-<style scoped>
-  .example {
-    flex-direction: row;
-    justify-content: flex-start;
-    margin-top: 60px;
-  }
-  .label {
-    font-size: 40px;
-    line-height: 60px;
-    width: 350px;
-    color: #666;
-    text-align: right;
-    margin-right: 20px;
-  }
-  .info {
-    font-size: 30px;
-    line-height: 60px;
-    color: #BBB;
-    margin-left: 10px;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/06b1d740fb69d04f9ebe9eaf730974d1)

http://git-wip-us.apache.org/repos/asf/incubator-weex/blob/8162f8c2/doc/source/cn/references/components/text.md
----------------------------------------------------------------------
diff --git a/doc/source/cn/references/components/text.md 
b/doc/source/cn/references/components/text.md
deleted file mode 100644
index b91f6f9..0000000
--- a/doc/source/cn/references/components/text.md
+++ /dev/null
@@ -1,136 +0,0 @@
----
-title: <text>
-type: references
-order: 2.13
-version: 2.1
----
-
-# &lt;text&gt;
-
-`<text>` 是 Weex 内置的组件,用来将文本按照指定的æ 
·å¼æ¸²æŸ“出来。`<text>` 只能包含文本值,你可以使用 `{% raw 
%}{{}}{% endraw %}` 标记插入变量值作为文本内容。
-
-## 子组件
-
-此组件不支持子组件。
-
-## 特性
-
-- `value {string}`: 组件的值,与 `<text>` 标签中的文本内
容相同。
-
-## 样式
-
-- `lines {number}`: 指定文本行数。默认值是 `0` 
代表不限制行数。
-- text styles: 查看 [文本样式](../text-style.html)
-
-  - 支持 `color` 样式.
-  - 支持 `font-size` 样式. 
iOS默认值:`32`,Android:不同设备不同,H5 默认值:`32`.
-  - 支持 `font-style` 样式.
-  - 支持 `font-weight` 样式.
-  - 支持 `text-align` 样式.
-  - 支持 `text-decoration` 样式.
-  - 支持 `text-overflow` 样式.
-  - 支持 `line-height`样式<sup class="wx-v">0.6.1+</sup>
-  - 不支持 `flex-direction`, `justify-content`, `align-items` 
这些为子节点设置的属性,并且`<text>`没有子节点。
-
-- 通用样式:支持所有通用样式
-
-  - 盒模型
-  - `flexbox` 布局
-  - `position`
-  - `opacity`
-  - `background-color`
-
-  查看 [组件通用样式](../common-style.html)
-
-## 事件
-
-- 通用事件
-  支持所有通用事件:
-
-  - `click`
-  - `longpress`
-  - `appear`
-  - `disappear`
-
-  查看 [通用事件](../common-event.html)
-
-## 约束
-
-1. `<text>` 
里直接写文本头尾空白会被过滤,如果需要保留头尾空白,暂时只能通过数据绑定写头尾空æ
 ¼ã€‚
-
-## iconfont 
-
-`支持版本:v0.12.0`
-
-支持ttf和woff字体格式的自定义字体, 可以通过调用 `dom` 
module 里面的 [addRule](../modules/dom.html#addRule)方法, 
构建自定义的`font-family`使用, addRule 建议在 `beforeCreate` 或者
更早时调用
-
-```html
-<template>
-    <div style='flex-direction:row;margin-top:50px'>
-        <text 
style='font-family:iconfont4;font-size:50;color:green'>&#xe614;&#xe612;&#xe613;</text>
-        <text 
style='font-family:iconfont4;font-size:50;'>&#xe614;&#xe612;&#xe613;&#xe61d;&#xe714;</text>
-        <text 
style='font-family:iconfont4;font-size:60;color:blue'>&#xe711;</text>
-        <text 
style='font-family:iconfont4;font-size:60;color:green'>&#xe71c;&#xe60b;</text>
-    </div>
-</template>
-<script>
-    module.exports = {
-        beforeCreate: function() {
-
-        var domModule = weex.requireModule('dom');
-        //目前支持ttf、woff文件,不支持svg、eot类型,moreItem at 
http://www.iconfont.cn/
-
-        domModule.addRule('fontFace', {
-            'fontFamily': "iconfont2",
-            'src': "url('http://at.alicdn.com/t/font_1469606063_76593.ttf')"
-        });
-    }
-}
-</script>
-```
-
-[try it](http://dotwe.org/vue/95b2c6716f37066d5f44c5c75c979394)
-
-## 示例
-
-```html
-<template>
-  <div class="wrapper">
-    <div class="panel">
-      <text class="text" lines="3">Weex 
是一套简单易用的跨平台开发方案,能以 Web 
的开发体验构建高性能、可扩展的原生应用。Vue 
是一个轻量并且功能强大的渐进式前端框架。</text>
-    </div>
-    <div class="panel">
-      <text class="text" lines="3">Weex is an cross-platform development 
solution that builds high-performance, scalable native applications with a Web 
development experience. Vue is a lightweight and powerful progressive front-end 
framework. </text>
-    </div>
-  </div>
-</template>
-
-
-<style scoped>
-  .wrapper {
-    flex-direction: column;
-    justify-content: center;
-  }
-  .panel {
-    width: 600px;
-    margin-left: 75px;
-    border-width: 2px;
-    border-style: solid;
-    border-color: #BBB;
-    padding-top: 15px;
-    padding-bottom: 15px;
-    padding-left: 15px;
-    padding-right: 15px;
-    margin-bottom: 30px;
-  }
-  .text {
-    lines: 3;
-    color: #666666;
-    font-size: 32px;
-  }
-</style>
-```
-
-[try it](http://dotwe.org/vue/154e20171d350a081fba7878c53cf7d2)
-
-


Reply via email to