diff --git a/docs/markdown/migrate-from-v2.zh-CN.md b/docs/markdown/migrate-from-v2.zh-CN.md index 0ab8380d2..a774165a6 100644 --- a/docs/markdown/migrate-from-v2.zh-CN.md +++ b/docs/markdown/migrate-from-v2.zh-CN.md @@ -81,7 +81,7 @@ GoodsAction 商品导航组件重命名为 **ActionBar 行动栏**。 ``` -### 其他组件 v-model 调整 +### 其他 v-model 调整 - Circle: `v-model` 重命名为 `v-model:currentRate` - CouponList: `v-model` 重命名为 `v-model:code` @@ -113,3 +113,23 @@ GoodsAction 商品导航组件重命名为 **ActionBar 行动栏**。 - GoodsActionIcon 同时内部使用的 Info 组件也会重命名为 Badge。 + +### 注册全局方法 + +Vant 2.x 中默认提供了 `$toast`、`$dialog` 等全局方法,但 Vue 3.0 不再支持直接在 Vue 的原型链上挂载方法,因此从 Vant 3.0 开始,使用全局方法前必须先通过 `app.use` 将组件注册到对应的 app 上。 + +```js +import { Toast, Dialog, Notify } from 'vant'; + +// 将 Toast 等组件注册到 app 上 +app.use(Toast); +app.use(Dialog); +app.use(Notify); + +// app 内的子组件可以直接调用 $toast 等方法 +export default { + mounted() { + this.$toast('提示文案'); + }, +}; +``` diff --git a/src/dialog/README.md b/src/dialog/README.md index 4e580bc20..b503b04bf 100644 --- a/src/dialog/README.md +++ b/src/dialog/README.md @@ -88,7 +88,7 @@ Dialog.confirm({ ### Global Method -After import the Dialog component, the `$dialog` method is automatically mounted on Vue.prototype, making it easy to call within a vue component. +After registering the Dialog component through `app.use`, the `$dialog` method will be automatically mounted on all subcomponents of the app. ```js export default { diff --git a/src/dialog/README.zh-CN.md b/src/dialog/README.zh-CN.md index 07272b14a..c5beed50f 100644 --- a/src/dialog/README.zh-CN.md +++ b/src/dialog/README.zh-CN.md @@ -116,7 +116,7 @@ Dialog.confirm({ ### 全局方法 -引入 Dialog 组件后,会自动在 Vue 的 prototype 上挂载 `$dialog` 方法,在所有组件内部都可以直接调用此方法。 +通过 `app.use` 注册 Dialog 组件后,会自动在 app 的所有子组件上挂载 `$dialog` 方法,在所有组件内部都可以直接调用此方法。 ```js export default { diff --git a/src/notify/README.md b/src/notify/README.md index 2a50e6ba3..a8c5e6ece 100644 --- a/src/notify/README.md +++ b/src/notify/README.md @@ -43,7 +43,7 @@ Notify({ ### Global Method -After import the Notify component, the `$notify` method is automatically mounted on Vue.prototype, making it easy to call within a vue component. +After registering the Notify component through `app.use`, the `$notify` method will be automatically mounted on all subcomponents of the app. ```js export default { diff --git a/src/notify/README.zh-CN.md b/src/notify/README.zh-CN.md index 737eb5ec9..01475ca7b 100644 --- a/src/notify/README.zh-CN.md +++ b/src/notify/README.zh-CN.md @@ -78,7 +78,7 @@ Notify({ ### 全局方法 -引入 Notify 组件后,会自动在 Vue 的 prototype 上挂载 `$notify` 方法,便于在组件内调用。 +通过 `app.use` 注册 Notify 组件后,会自动在 app 的所有子组件上挂载 `$notify` 方法,便于在组件内调用。 ```js export default { diff --git a/src/toast/README.md b/src/toast/README.md index 92b18dc77..7f5eb4a56 100644 --- a/src/toast/README.md +++ b/src/toast/README.md @@ -77,7 +77,7 @@ const timer = setInterval(() => { ### Global Method -After import the Toast component, the `$toast` method is automatically mounted on Vue.prototype, making it easy to call within a vue component. +After registering the Toast component through `app.use`, the `$toast` method will be automatically mounted on all subcomponents of the app. ```js export default { diff --git a/src/toast/README.zh-CN.md b/src/toast/README.zh-CN.md index 602f5397a..5a814ea21 100644 --- a/src/toast/README.zh-CN.md +++ b/src/toast/README.zh-CN.md @@ -90,7 +90,7 @@ const timer = setInterval(() => { ### 全局方法 -引入 Toast 组件后,会自动在 Vue 的 prototype 上挂载 `$toast` 方法,便于在组件内调用。 +通过 `app.use` 注册 Toast 组件后,会自动在 app 的所有子组件上挂载 `$toast` 方法,便于在组件内调用。 ```js export default {