diff --git a/docs/examples-docs/actionsheet.md b/docs/examples-docs/actionsheet.md
index a3e353a49..09cd0fef6 100644
--- a/docs/examples-docs/actionsheet.md
+++ b/docs/examples-docs/actionsheet.md
@@ -55,6 +55,13 @@ export default {
## Actionsheet 行动按钮
+### 使用指南
+``` javascript
+import { Actionsheet } from 'vant';
+
+Vue.component(Actionsheet.name, Actionsheet);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/badge.md b/docs/examples-docs/badge.md
index d8cec30bc..b0f27058c 100644
--- a/docs/examples-docs/badge.md
+++ b/docs/examples-docs/badge.md
@@ -28,6 +28,13 @@
## Badge 徽章
+### 使用指南
+``` javascript
+import { Badge } from 'vant';
+
+Vue.component(Badge.name, Badge);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/button.md b/docs/examples-docs/button.md
index 2f57ec21f..7f110c895 100644
--- a/docs/examples-docs/button.md
+++ b/docs/examples-docs/button.md
@@ -21,6 +21,13 @@
## Button 按钮
+### 使用指南
+``` javascript
+import { Button } from 'vant';
+
+Vue.component(Button.name, Button);
+```
+
### 代码演示
#### 按钮类型
diff --git a/docs/examples-docs/card.md b/docs/examples-docs/card.md
index 79d1704db..993c39f6d 100644
--- a/docs/examples-docs/card.md
+++ b/docs/examples-docs/card.md
@@ -1,5 +1,12 @@
## Card 图文组件
+### 使用指南
+``` javascript
+import { Card } from 'vant';
+
+Vue.component(Card.name, Card);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/cell-swipe.md b/docs/examples-docs/cell-swipe.md
index 4be8e7d11..45225aabd 100644
--- a/docs/examples-docs/cell-swipe.md
+++ b/docs/examples-docs/cell-swipe.md
@@ -22,6 +22,13 @@
## CellSwipe 滑动单元格
+### 使用指南
+``` javascript
+import { CellSwipe } from 'vant';
+
+Vue.component(CellSwipe.name, CellSwipe);
+```
+
### 代码演示
#### 基础用法
@@ -32,13 +39,8 @@
-
-
- 删除
-
-
- 选择
-
+ 删除
+ 选择
```
:::
@@ -48,13 +50,13 @@
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|-----------|-----------|-----------|-------------|-------------|
-| right-width | 右侧滑动按钮宽度 | `number` | 0 | |
-| left-width | 左侧滑动按钮宽度 | `number` | 0 | |
+| left-width | 左侧滑动按钮宽度 | `number` | 0 | |
+| right-width | 右侧滑动按钮宽度 | `number` | 0 | |
### Slot
| name | 描述 |
|-----------|-----------|
| - | 自定义显示内容 |
-| right | 右侧滑动内容 |
| left | 左侧滑动内容 |
+| right | 右侧滑动内容 |
diff --git a/docs/examples-docs/cell.md b/docs/examples-docs/cell.md
index f3c9c3ffc..b2566b15a 100644
--- a/docs/examples-docs/cell.md
+++ b/docs/examples-docs/cell.md
@@ -10,6 +10,14 @@ export default {
## Cell 单元格
+### 使用指南
+``` javascript
+import { Cell, CellGroup } from 'vant';
+
+Vue.component(Cell.name, Cell);
+Vue.component(CellGroup.name, CellGroup);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/checkbox.md b/docs/examples-docs/checkbox.md
index eb7770e30..fdfcba1d7 100644
--- a/docs/examples-docs/checkbox.md
+++ b/docs/examples-docs/checkbox.md
@@ -35,6 +35,13 @@ export default {
## Checkbox 复选框
+### 使用指南
+``` javascript
+import { Checkbox } from 'vant';
+
+Vue.component(Checkbox.name, Checkbox);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/datetime-picker.md b/docs/examples-docs/datetime-picker.md
index f1b8f0dd2..3f122139d 100644
--- a/docs/examples-docs/datetime-picker.md
+++ b/docs/examples-docs/datetime-picker.md
@@ -27,6 +27,13 @@ export default {
## DatetimePicker 时间选择
+### 使用指南
+``` javascript
+import { DatetimePicker } from 'vant';
+
+Vue.component(DatetimePicker.name, DatetimePicker);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/field.md b/docs/examples-docs/field.md
index f8789446d..97a24a36a 100644
--- a/docs/examples-docs/field.md
+++ b/docs/examples-docs/field.md
@@ -29,6 +29,13 @@ export default {
表单中`input`或`textarea`的输入框。
+### 使用指南
+``` javascript
+import { Field } from 'vant';
+
+Vue.component(Field.name, Field);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/layout.md b/docs/examples-docs/layout.md
index 846437c7c..8df684302 100644
--- a/docs/examples-docs/layout.md
+++ b/docs/examples-docs/layout.md
@@ -28,7 +28,14 @@
## Layout 布局
-主要提供了`van-row`和`van-col`两个组件来进行行列布局。
+提供了`van-row`和`van-col`两个组件来进行行列布局。
+
+### 使用指南
+``` javascript
+import { Layout } from 'vant';
+
+Vue.component(Layout.name, Layout);
+```
### 代码演示
diff --git a/docs/examples-docs/loading.md b/docs/examples-docs/loading.md
index 4290c9564..098e7001d 100644
--- a/docs/examples-docs/loading.md
+++ b/docs/examples-docs/loading.md
@@ -20,6 +20,13 @@
## Loading 加载
+### 使用指南
+``` javascript
+import { Loading } from 'vant';
+
+Vue.component(Loading.name, Loading);
+```
+
### 代码演示
#### 渐变深色spinner
diff --git a/docs/examples-docs/panel.md b/docs/examples-docs/panel.md
index bf5c6530a..899cb071e 100644
--- a/docs/examples-docs/panel.md
+++ b/docs/examples-docs/panel.md
@@ -29,6 +29,13 @@
## Panel 面板
+### 使用指南
+``` javascript
+import { Panel } from 'vant';
+
+Vue.component(Panel.name, Panel);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/picker.md b/docs/examples-docs/picker.md
index 8dc626267..0d3b7acac 100644
--- a/docs/examples-docs/picker.md
+++ b/docs/examples-docs/picker.md
@@ -38,6 +38,13 @@ export default {
## Picker 选择器
+### 使用指南
+``` javascript
+import { Picker } from 'vant';
+
+Vue.component(Picker.name, Picker);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/popup.md b/docs/examples-docs/popup.md
index d3d3b32ac..892b9df15 100644
--- a/docs/examples-docs/popup.md
+++ b/docs/examples-docs/popup.md
@@ -75,6 +75,13 @@ export default {
## Popup 弹出菜单
+### 使用指南
+``` javascript
+import { Popup } from 'vant';
+
+Vue.component(Popup.name, Popup);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/progress.md b/docs/examples-docs/progress.md
index 57c93c052..efb9a2993 100644
--- a/docs/examples-docs/progress.md
+++ b/docs/examples-docs/progress.md
@@ -10,6 +10,13 @@
## Progress 进度条
+### 使用指南
+``` javascript
+import { Progress } from 'vant';
+
+Vue.component(Progress.name, Progress);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/quantity.md b/docs/examples-docs/quantity.md
index f00c49264..1361400ff 100644
--- a/docs/examples-docs/quantity.md
+++ b/docs/examples-docs/quantity.md
@@ -23,6 +23,13 @@ export default {
## Quantity 数量选择
+### 使用指南
+``` javascript
+import { Quantity } from 'vant';
+
+Vue.component(Quantity.name, Quantity);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/radio.md b/docs/examples-docs/radio.md
index 03a1b2522..e580b966b 100644
--- a/docs/examples-docs/radio.md
+++ b/docs/examples-docs/radio.md
@@ -25,6 +25,13 @@ export default {
## Radio 单选框
+### 使用指南
+``` javascript
+import { Radio } from 'vant';
+
+Vue.component(Radio.name, Radio);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/search.md b/docs/examples-docs/search.md
index acc8f62ff..a46d12c25 100644
--- a/docs/examples-docs/search.md
+++ b/docs/examples-docs/search.md
@@ -16,6 +16,13 @@ export default {
## Search 搜索
+### 使用指南
+``` javascript
+import { Search } from 'vant';
+
+Vue.component(Search.name, Search);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/steps.md b/docs/examples-docs/steps.md
index 0334e692e..d9d229b4b 100644
--- a/docs/examples-docs/steps.md
+++ b/docs/examples-docs/steps.md
@@ -28,6 +28,14 @@ export default {
## Steps 步骤条
+### 使用指南
+``` javascript
+import { Step, Steps } from 'vant';
+
+Vue.component(Step.name, Step);
+Vue.component(Steps.name, Steps);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/swipe.md b/docs/examples-docs/swipe.md
index 6343fc1b8..2ce3618c8 100644
--- a/docs/examples-docs/swipe.md
+++ b/docs/examples-docs/swipe.md
@@ -35,6 +35,13 @@ export default {
## Swipe 轮播
+### 使用指南
+``` javascript
+import { Swipe } from 'vant';
+
+Vue.component(Swipe.name, Swipe);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/switch.md b/docs/examples-docs/switch.md
index 40500b81f..cb02b9ec8 100644
--- a/docs/examples-docs/switch.md
+++ b/docs/examples-docs/switch.md
@@ -43,6 +43,13 @@ export default {
## Switch 开关
+### 使用指南
+``` javascript
+import { Switch } from 'vant';
+
+Vue.component(Switch.name, Switch);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/tab.md b/docs/examples-docs/tab.md
index 5e4af3cbe..4c2d7486e 100644
--- a/docs/examples-docs/tab.md
+++ b/docs/examples-docs/tab.md
@@ -49,6 +49,14 @@ export default {
## Tab 标签
+### 使用指南
+``` javascript
+import { Tab, Tabs } from 'vant';
+
+Vue.component(Tab.name, Tab);
+Vue.component(Tabs.name, Tabs);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/tag.md b/docs/examples-docs/tag.md
index 5dd8f00d2..4d21b6ba6 100644
--- a/docs/examples-docs/tag.md
+++ b/docs/examples-docs/tag.md
@@ -10,6 +10,13 @@
## Tag 标记
+### 使用指南
+``` javascript
+import { Tag } from 'vant';
+
+Vue.component(Tag.name, Tag);
+```
+
### 代码演示
#### 基础用法
diff --git a/docs/examples-docs/uploader.md b/docs/examples-docs/uploader.md
index 9eeab2469..f09410dc2 100644
--- a/docs/examples-docs/uploader.md
+++ b/docs/examples-docs/uploader.md
@@ -16,6 +16,13 @@ export default {
## Uploader 图片上传
+### 使用指南
+``` javascript
+import { Uploader } from 'vant';
+
+Vue.component(Uploader.name, Uploader);
+```
+
### 代码演示
#### 基础用法