From a589fc2d125884c4f88d940f5db71a9f21f80ff2 Mon Sep 17 00:00:00 2001
From: neverland <chenjiahan@youzan.com>
Date: Thu, 12 Aug 2021 10:10:42 +0800
Subject: [PATCH] types(NoticeBar): add NoticeBarInstance type (#9245)

---
 src/notice-bar/NoticeBar.tsx   | 56 +++++++++++++++++++++-------------
 src/notice-bar/README.md       | 13 ++++++++
 src/notice-bar/README.zh-CN.md | 13 ++++++++
 src/notice-bar/index.ts        |  2 +-
 src/notice-bar/types.ts        | 13 ++++++++
 5 files changed, 74 insertions(+), 23 deletions(-)
 create mode 100644 src/notice-bar/types.ts

diff --git a/src/notice-bar/NoticeBar.tsx b/src/notice-bar/NoticeBar.tsx
index f12865312..14b81bda7 100644
--- a/src/notice-bar/NoticeBar.tsx
+++ b/src/notice-bar/NoticeBar.tsx
@@ -1,4 +1,11 @@
-import { ref, watch, reactive, PropType, defineComponent } from 'vue';
+import {
+  ref,
+  watch,
+  reactive,
+  PropType,
+  defineComponent,
+  ExtractPropTypes,
+} from 'vue';
 
 // Utils
 import { isDef, createNamespace } from '../utils';
@@ -17,33 +24,38 @@ import { onPopupReopen } from '../composables/on-popup-reopen';
 // Components
 import { Icon } from '../icon';
 
-export type NoticeBarMode = 'closeable' | 'link';
+// Types
+import { NoticeBarMode } from './types';
 
 const [name, bem] = createNamespace('notice-bar');
 
+const props = {
+  text: String,
+  mode: String as PropType<NoticeBarMode>,
+  color: String,
+  leftIcon: String,
+  wrapable: Boolean,
+  background: String,
+  scrollable: {
+    type: Boolean as PropType<boolean | null>,
+    default: null,
+  },
+  delay: {
+    type: [Number, String],
+    default: 1,
+  },
+  speed: {
+    type: [Number, String],
+    default: 60,
+  },
+};
+
+export type NoticeBarProps = ExtractPropTypes<typeof props>;
+
 export default defineComponent({
   name,
 
-  props: {
-    text: String,
-    mode: String as PropType<NoticeBarMode>,
-    color: String,
-    leftIcon: String,
-    wrapable: Boolean,
-    background: String,
-    scrollable: {
-      type: Boolean as PropType<boolean | null>,
-      default: null,
-    },
-    delay: {
-      type: [Number, String],
-      default: 1,
-    },
-    speed: {
-      type: [Number, String],
-      default: 60,
-    },
-  },
+  props,
 
   emits: ['close', 'replay'],
 
diff --git a/src/notice-bar/README.md b/src/notice-bar/README.md
index 02662dd17..4a3211be3 100644
--- a/src/notice-bar/README.md
+++ b/src/notice-bar/README.md
@@ -115,6 +115,19 @@ Use [ref](https://v3.vuejs.org/guide/component-template-refs.html) to get Notice
 | -------------- | --------------- | --------- | ------------ |
 | reset `v3.1.1` | Reset NoticeBar | -         | -            |
 
+### Types
+
+Get the type definition of the NoticeBar instance through `NoticeBarInstance`.
+
+```ts
+import { ref } from 'vue';
+import type { NoticeBarInstance } from 'vant';
+
+const noticeBarRef = ref<NoticeBarInstance>();
+
+noticeBarRef.value?.reset();
+```
+
 ### Slots
 
 | Name       | Description         |
diff --git a/src/notice-bar/README.zh-CN.md b/src/notice-bar/README.zh-CN.md
index ee416bfa9..bea040df9 100644
--- a/src/notice-bar/README.zh-CN.md
+++ b/src/notice-bar/README.zh-CN.md
@@ -136,6 +136,19 @@ app.use(NoticeBar);
 | -------------- | -------------------- | ---- | ------ |
 | reset `v3.1.1` | 重置通知栏到初始状态 | -    | -      |
 
+### 类型定义
+
+通过 `NoticeBarInstance` 获取 NoticeBar 实例的类型定义（从 3.2.0 版本开始支持）。
+
+```ts
+import { ref } from 'vue';
+import type { NoticeBarInstance } from 'vant';
+
+const noticeBarRef = ref<NoticeBarInstance>();
+
+noticeBarRef.value?.reset();
+```
+
 ### Slots
 
 | 名称       | 内容           |
diff --git a/src/notice-bar/index.ts b/src/notice-bar/index.ts
index 27536f692..780eae59e 100644
--- a/src/notice-bar/index.ts
+++ b/src/notice-bar/index.ts
@@ -5,4 +5,4 @@ const NoticeBar = withInstall<typeof _NoticeBar>(_NoticeBar);
 
 export default NoticeBar;
 export { NoticeBar };
-export type { NoticeBarMode } from './NoticeBar';
+export type { NoticeBarMode, NoticeBarInstance } from './types';
diff --git a/src/notice-bar/types.ts b/src/notice-bar/types.ts
new file mode 100644
index 000000000..69dc2bfa2
--- /dev/null
+++ b/src/notice-bar/types.ts
@@ -0,0 +1,13 @@
+import type { ComponentPublicInstance } from 'vue';
+import type { NoticeBarProps } from './NoticeBar';
+
+export type NoticeBarMode = 'closeable' | 'link';
+
+export type NoticeBarExpose = {
+  reset: () => void;
+};
+
+export type NoticeBarInstance = ComponentPublicInstance<
+  NoticeBarProps,
+  NoticeBarExpose
+>;