From e6e82918e6f86879fd573fc6958a5db45b2dd67c Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Thu, 18 Mar 2021 09:55:19 +0800
Subject: [PATCH] docs: add component registration guide (#8375)

---
 docs/markdown/advanced-usage.en-US.md | 39 +++++++++++++++++++++++++++
 docs/markdown/advanced-usage.zh-CN.md | 39 +++++++++++++++++++++++++++
 2 files changed, 78 insertions(+)

diff --git a/docs/markdown/advanced-usage.en-US.md b/docs/markdown/advanced-usage.en-US.md
index f78091d35..293e86aef 100644
--- a/docs/markdown/advanced-usage.en-US.md
+++ b/docs/markdown/advanced-usage.en-US.md
@@ -1,5 +1,44 @@
 # Advanced Usage
 
+### Intro
+
+Through this chapter, you can learn about some advanced usages of Vant.
+
+## Component Usage
+
+### Component Registration
+
+Vant supports multiple ways to register components:
+
+#### Global Registration
+
+```js
+import { Button } from 'vant';
+import { createApp } from 'vue';
+
+const app = createApp();
+
+// Method 1. via app.use
+app.use(Button);
+
+// Method 2. Register via app.component
+app.component(Button.name, Button);
+```
+
+#### Local Registration
+
+```js
+import { Button } from 'vant';
+
+export default {
+  components: {
+    [Button.name]: Button,
+  },
+};
+```
+
+> For more information, please refer to [Vue.js - Component Registration](https://v3.vuejs.org/guide/component-registration.html#component-registration)。
+
 ## Browser adaptation
 
 ### Viewport Units
diff --git a/docs/markdown/advanced-usage.zh-CN.md b/docs/markdown/advanced-usage.zh-CN.md
index 9cd670cb2..52e25a59e 100644
--- a/docs/markdown/advanced-usage.zh-CN.md
+++ b/docs/markdown/advanced-usage.zh-CN.md
@@ -6,6 +6,45 @@
 
 ## 组件用法
 
+### 组件注册
+
+Vant 支持多种组件注册方式，请根据实际业务需要进行选择。
+
+#### 全局注册
+
+全局注册后，你可以在 app 下的任意子组件中使用注册的 Vant 组件。
+
+```js
+import { Button } from 'vant';
+import { createApp } from 'vue';
+
+const app = createApp();
+
+// 方式一. 通过 app.use 注册
+// 注册完成后，在模板中通过 VanButton 或 van-button 标签均可使用按钮组件
+app.use(Button);
+
+// 方式二. 通过 app.component 注册
+// 注册完成后，在模板中通过 van-button 标签即可使用按钮组件
+app.component(Button.name, Button);
+```
+
+#### 局部注册
+
+局部注册后，你可以在当前组件中使用注册的 Vant 组件。
+
+```js
+import { Button } from 'vant';
+
+export default {
+  components: {
+    [Button.name]: Button,
+  },
+};
+```
+
+> 对于组件注册更详细的介绍，请参考 [Vue 官方文档 - 组件注册](https://v3.cn.vuejs.org/guide/component-registration.html#%E7%BB%84%E4%BB%B6%E6%B3%A8%E5%86%8C)。
+
 ### 组件插槽
 
 Vant 提供了丰富的组件插槽，通过插槽可以对组件的某一部分进行个性化定制。如果你对 Vue 的插槽不太熟悉，可以阅读 Vue 官方文档中的[插槽章节](https://v3.cn.vuejs.org/guide/component-slots.html)。下面是通过插槽来定制 Checkbox 图标的示例：