From 1999195c4617011f18e42b30d8a7dbb8f6893659 Mon Sep 17 00:00:00 2001
From: chenjiahan <chenjiahan@youzan.com>
Date: Fri, 20 Nov 2020 11:08:02 +0800
Subject: [PATCH] docs(Popover): add select event demo

---
 src/popover/README.md       |  9 ++++++++-
 src/popover/README.zh-CN.md |  9 ++++++++-
 src/popover/demo/index.vue  | 11 +++++++++++
 3 files changed, 27 insertions(+), 2 deletions(-)

diff --git a/src/popover/README.md b/src/popover/README.md
index 284dda82b..4d9499ece 100644
--- a/src/popover/README.md
+++ b/src/popover/README.md
@@ -14,7 +14,7 @@ Vue.use(Popover);
 ### Basic Usage
 
 ```html
-<van-popover v-model="showPopover" :actions="actions">
+<van-popover v-model="showPopover" :actions="actions" @select="onSelect">
   <template #reference>
     <van-button type="primary" @click="showPopover = true">
       Light Theme
@@ -24,6 +24,8 @@ Vue.use(Popover);
 ```
 
 ```js
+import { Toast } from 'vant';
+
 export default {
   data() {
     return {
@@ -35,6 +37,11 @@ export default {
       ],
     };
   },
+  methods: {
+    onSelect(action) {
+      Toast(action.text);
+    },
+  },
 };
 ```
 
diff --git a/src/popover/README.zh-CN.md b/src/popover/README.zh-CN.md
index 6b92d0d4a..12ade4c26 100644
--- a/src/popover/README.zh-CN.md
+++ b/src/popover/README.zh-CN.md
@@ -20,7 +20,7 @@ Vue.use(Popover);
 当 Popover 弹出时，会基于 `reference` 插槽的内容进行定位。
 
 ```html
-<van-popover v-model="showPopover" :actions="actions">
+<van-popover v-model="showPopover" :actions="actions" @select="onSelect">
   <template #reference>
     <van-button type="primary" @click="showPopover = true">
       浅色风格
@@ -30,6 +30,8 @@ Vue.use(Popover);
 ```
 
 ```js
+import { Toast } from 'vant';
+
 export default {
   data() {
     return {
@@ -38,6 +40,11 @@ export default {
       actions: [{ text: '选项一' }, { text: '选项二' }, { text: '选项三' }],
     };
   },
+  methods: {
+    onSelect(action) {
+      Toast(action.text);
+    },
+  },
 };
 ```
 
diff --git a/src/popover/demo/index.vue b/src/popover/demo/index.vue
index 2ff184a6f..b23669027 100644
--- a/src/popover/demo/index.vue
+++ b/src/popover/demo/index.vue
@@ -6,6 +6,7 @@
         :actions="t('actions')"
         placement="bottom-start"
         style="margin-left: 16px;"
+        @select="onSelect"
       >
         <template #reference>
           <van-button type="primary" @click="show.lightTheme = true">
@@ -18,6 +19,7 @@
         theme="dark"
         :actions="t('actions')"
         style="margin-left: 16px;"
+        @select="onSelect"
       >
         <template #reference>
           <van-button type="primary" @click="show.darkTheme = true">
@@ -48,6 +50,7 @@
             theme="dark"
             :actions="t('shortActions')"
             :placement="currentPlacement"
+            @select="onSelect"
           >
             <template #reference>
               <div class="demo-popover-refer" />
@@ -64,6 +67,7 @@
         :actions="t('actionsWithIcon')"
         placement="bottom-start"
         style="margin-left: 16px;"
+        @select="onSelect"
       >
         <template #reference>
           <van-button type="primary" @click="show.showIcon = true">
@@ -76,6 +80,7 @@
         v-model="show.disableAction"
         :actions="t('actionsDisabled')"
         style="margin-left: 16px;"
+        @select="onSelect"
       >
         <template #reference>
           <van-button type="primary" @click="show.disableAction = true">
@@ -90,6 +95,7 @@
         v-model="show.customContent"
         placement="top-start"
         style="margin-left: 16px;"
+        @select="onSelect"
       >
         <van-grid
           square
@@ -117,6 +123,8 @@
 </template>
 
 <script>
+import Toast from '../../toast';
+
 export default {
   i18n: {
     'zh-CN': {
@@ -207,6 +215,9 @@ export default {
         this.currentPlacement = value;
       });
     },
+    onSelect(action) {
+      Toast(action.text);
+    },
   },
 };
 </script>