[new feature] add List component (#682)

docs/markdown/en-US/list.md

@@ -0,0 +1,66 @@
+## List
+A list component to show items and control loading status.
+
+### Install
+``` javascript
+import { List } from 'vant';
+
+Vue.use(List);
+```
+
+### Usage
+
+#### Basic Usage
+
+```html
+<van-list
+  v-model="loading"
+  :finished="finished"
+  @load="onLoad"
+>
+  <van-cell v-for="item in list" :key="item" :title="item + ''" />
+</van-list>
+```
+
+```js
+export default {
+  data() {
+    return {
+      list: [],
+      loading: false,
+      finished: false
+    };
+  },
+
+  methods: {
+    onLoad() {
+      setTimeout(() => {
+        for (let i = 0; i < 10; i++) {
+          this.list.push(this.list.length + 1);
+        }
+        this.loading = false;
+
+        if (this.list.length >= 40) {
+          this.finished = true;
+        }
+      }, 500);
+    }
+  }
+}
+```
+
+### API
+
+| Attribute | Description | Type | Default | Accepted Values |
+|-----------|-----------|-----------|-------------|-------------|
+| loading | Whether to show loading info，the `load` event will not be triggered when loading | `Boolean` | `false` | - |
+| finished | Whether loading is finished，the `load` event will not be triggered when finished | `Boolean` | `false` | - |
+| offset | The load event will be triggered when the distance between the scrollbar and the bottom is less than offset | `Number` | `300` | - |
+| loading-text | Loading text | `String` | `Loading...` | - |
+| immediate-check | Whether to check loading position immediately after mounted | `Boolean` | `true` | - |
+
+### Event
+
+| Event | Description | Arguments |
+|-----------|-----------|-----------|
+| load | Triggered when the distance between the scrollbar and the bottom is less than offset | - |

docs/markdown/en-US/waterfall.md

@@ -1,4 +1,5 @@
 ## Waterfall
+Note: Waterfall is deprecated and no longer maintained, please use the [List](#/zh-CN/list) component instead.
 
 ### Install
 

docs/markdown/index.js

@@ -40,6 +40,7 @@ export default {
   'zh-CN/intro': wrapper(r => require.ensure([], () => r(require('./zh-CN/intro.md')), 'zh-CN/intro')),
   'zh-CN/layout': wrapper(r => require.ensure([], () => r(require('./zh-CN/layout.md')), 'zh-CN/layout')),
   'zh-CN/lazyload': wrapper(r => require.ensure([], () => r(require('./zh-CN/lazyload.md')), 'zh-CN/lazyload')),
+  'zh-CN/list': wrapper(r => require.ensure([], () => r(require('./zh-CN/list.md')), 'zh-CN/list')),
   'zh-CN/loading': wrapper(r => require.ensure([], () => r(require('./zh-CN/loading.md')), 'zh-CN/loading')),
   'zh-CN/nav-bar': wrapper(r => require.ensure([], () => r(require('./zh-CN/nav-bar.md')), 'zh-CN/nav-bar')),
   'zh-CN/notice-bar': wrapper(r => require.ensure([], () => r(require('./zh-CN/notice-bar.md')), 'zh-CN/notice-bar')),
@@ -95,6 +96,7 @@ export default {
   'en-US/intro': wrapper(r => require.ensure([], () => r(require('./en-US/intro.md')), 'en-US/intro')),
   'en-US/layout': wrapper(r => require.ensure([], () => r(require('./en-US/layout.md')), 'en-US/layout')),
   'en-US/lazyload': wrapper(r => require.ensure([], () => r(require('./en-US/lazyload.md')), 'en-US/lazyload')),
+  'en-US/list': wrapper(r => require.ensure([], () => r(require('./en-US/list.md')), 'en-US/list')),
   'en-US/loading': wrapper(r => require.ensure([], () => r(require('./en-US/loading.md')), 'en-US/loading')),
   'en-US/nav-bar': wrapper(r => require.ensure([], () => r(require('./en-US/nav-bar.md')), 'en-US/nav-bar')),
   'en-US/notice-bar': wrapper(r => require.ensure([], () => r(require('./en-US/notice-bar.md')), 'en-US/notice-bar')),

docs/markdown/zh-CN/list.md

@@ -0,0 +1,66 @@
+## List 列表
+瀑布流滚动加载，用于控制长列表的展示
+
+### 使用指南
+``` javascript
+import { List } from 'vant';
+
+Vue.use(List);
+```
+
+### 代码演示
+
+#### 基础用法
+
+```html
+<van-list
+  v-model="loading"
+  :finished="finished"
+  @load="onLoad"
+>
+  <van-cell v-for="item in list" :key="item" :title="item + ''" />
+</van-list>
+```
+
+```js
+export default {
+  data() {
+    return {
+      list: [],
+      loading: false,
+      finished: false
+    };
+  },
+
+  methods: {
+    onLoad() {
+      setTimeout(() => {
+        for (let i = 0; i < 10; i++) {
+          this.list.push(this.list.length + 1);
+        }
+        this.loading = false;
+
+        if (this.list.length >= 40) {
+          this.finished = true;
+        }
+      }, 500);
+    }
+  }
+}
+```
+
+### API
+
+| 参数 | 说明 | 类型 | 默认值 | 可选值 |
+|-----------|-----------|-----------|-------------|-------------|
+| loading | 是否显示加载中提示，加载过程中不触发`load`事件 | `Boolean` | `false` | - |
+| finished | 是否已加载完成，加载完成后不再触发`load`事件 | `Boolean` | `false` | - |
+| offset | 滚动条与底部距离小于 offset 时触发`load`事件 | `Number` | `300` | - |
+| loading-text | 加载中提示文案 | `String` | `加载中...` | - |
+| immediate-check | 是否在初始化时立即执行滚动位置检查 | `Boolean` | `true` | - |
+
+### Event
+
+| 事件名 | 说明 | 参数 |
+|-----------|-----------|-----------|
+| load | 滚动条与底部距离小于 offset 时触发 | - |

docs/markdown/zh-CN/loading.md

@@ -34,6 +34,6 @@ Vue.use(Loading);
 
 | 参数 | 说明 | 类型 | 默认值 | 可选值 |
 |-----------|-----------|-----------|-------------|-------------|
-| color | 颜色 | `String` | `black` | `black` `white` |
+| color | 颜色 | `String` | `black` | `white` |
 | type | 类型 | `String` | `circular` | `spinner` `circle` |
 | size | 大小 | `String` | `30px` | - |

docs/markdown/zh-CN/waterfall.md

@@ -1,4 +1,5 @@
 ## Waterfall 瀑布流
+注意：Waterfall 组件已被废弃且不再维护，请使用 [List](#/zh-CN/list) 组件代替
 
 ### 使用指南
 
@@ -78,4 +79,3 @@ export default {
 | v-waterfall-upper | 滚动到顶部, 触发执行的函数 | `Function` | - | - |
 | waterfall-disabled | 在 vue 对象中表示是否禁止瀑布流触发的 key 值 | `String` | - | - |
 | waterfall-offset | 触发瀑布流加载的阈值 | `Number` | `300` | - |
-