diff --git a/docs/markdown/migrate-from-v2.zh-CN.md b/docs/markdown/migrate-from-v2.zh-CN.md
index 070e30917..ceabf40f5 100644
--- a/docs/markdown/migrate-from-v2.zh-CN.md
+++ b/docs/markdown/migrate-from-v2.zh-CN.md
@@ -197,6 +197,10 @@ Vue 3.0 中增加了 `Teleport` 组件,提供将组件渲染到任意 DOM 位
- 默认开启 `show-toolbar` 属性
- 级联选择下,`confirm`、`change` 事件返回的回调参数将包含为完整的选项对象。
+#### Popover
+
+- `trigger` 属性的默认值调整为 `click`
+
#### SwipeCell
- `open` 事件的 `detail` 参数重命名为 `name`
diff --git a/src/popover/README.md b/src/popover/README.md
index 6d4a51f49..759197f08 100644
--- a/src/popover/README.md
+++ b/src/popover/README.md
@@ -17,7 +17,7 @@ app.use(Popover);
```html
- Light Theme
+ Light Theme
```
@@ -51,7 +51,7 @@ Using the `theme` prop to change the style of Popover.
```html
- Dark Theme
+ Dark Theme
```
@@ -99,7 +99,7 @@ bottom-end # Bottom right
```html
- Show Icon
+ Show Icon
```
@@ -126,7 +126,7 @@ Using the `disabled` option to disable an action.
```html
- Disable Action
+ Disable Action
```
@@ -146,6 +146,41 @@ export default {
};
```
+### Custom Content
+
+```html
+
+
+
+
+
+ Custom Content
+
+
+```
+
+```js
+export default {
+ data() {
+ return {
+ showPopover: false,
+ };
+ },
+};
+```
+
## API
### Props
@@ -156,7 +191,7 @@ export default {
| actions | Actions | _Action[]_ | `[]` |
| placement | Placement | _string_ | `bottom` |
| theme | Theme,can be set to `dark` | _string_ | `light` |
-| trigger `v2.11.1` | Trigger mode,can be set to `click` | - |
+| trigger `v2.11.1` | Trigger mode,can be set to `manual` | `click` |
| offset | Distance to reference | _[number, number]_ | `[0, 8]` |
| overlay | Whether to show overlay | _boolean_ | `false` |
| close-on-click-action | Whether to close when clicking action | _boolean_ | `true` |
diff --git a/src/popover/README.zh-CN.md b/src/popover/README.zh-CN.md
index 4c5802dcd..3e4790c1d 100644
--- a/src/popover/README.zh-CN.md
+++ b/src/popover/README.zh-CN.md
@@ -23,7 +23,7 @@ app.use(Popover);
```html
- 浅色风格
+ 浅色风格
```
@@ -54,7 +54,7 @@ Popover 支持浅色和深色两种风格,默认为浅色风格,将 `theme`
```html
- 深色风格
+ 深色风格
```
@@ -102,7 +102,7 @@ bottom-end # 底部右侧位置
```html
- 展示图标
+ 展示图标
```
@@ -129,7 +129,7 @@ export default {
```html
- 禁用选项
+ 禁用选项
```
@@ -171,7 +171,7 @@ export default {
/>
- 自定义内容
+ 自定义内容
```
@@ -196,7 +196,7 @@ export default {
| actions | 选项列表 | _Action[]_ | `[]` |
| placement | 弹出位置 | _string_ | `bottom` |
| theme | 主题风格,可选值为 `dark` | _string_ | `light` |
-| trigger `v2.11.1` | 触发方式,可选值为 `click` | - |
+| trigger `v2.11.1` | 触发方式,可选值为 `manual` | `click` |
| offset | 出现位置的偏移量 | _[number, number]_ | `[0, 8]` |
| overlay | 是否显示遮罩层 | _boolean_ | `false` |
| close-on-click-action | 是否在点击选项后关闭 | _boolean_ | `true` |
diff --git a/src/popover/demo/index.vue b/src/popover/demo/index.vue
index 09f93c00b..7dcc4412b 100644
--- a/src/popover/demo/index.vue
+++ b/src/popover/demo/index.vue
@@ -7,7 +7,7 @@
@select="onSelect"
>
-
+
{{ t('lightTheme') }}
@@ -19,7 +19,7 @@
@select="onSelect"
>
-
+
{{ t('darkTheme') }}
@@ -70,7 +70,7 @@
@select="onSelect"
>
-
+
{{ t('showIcon') }}
@@ -82,7 +82,7 @@
@select="onSelect"
>
-
+
{{ t('disableAction') }}
@@ -111,7 +111,7 @@
/>
-
+
{{ t('customContent') }}
diff --git a/src/popover/index.js b/src/popover/index.js
index a2d069673..34b05cea4 100644
--- a/src/popover/index.js
+++ b/src/popover/index.js
@@ -2,7 +2,7 @@ import { ref, watch, nextTick, onMounted, onBeforeUnmount } from 'vue';
import { createPopper, offsetModifier } from '@vant/popperjs';
// Utils
-import { createNamespace } from '../utils';
+import { createNamespace, stopPropagation } from '../utils';
import { BORDER_BOTTOM } from '../utils/constant';
// Composition
@@ -19,7 +19,6 @@ export default createComponent({
props: {
show: Boolean,
- trigger: String,
overlay: Boolean,
offset: {
type: Array,
@@ -29,6 +28,10 @@ export default createComponent({
type: String,
default: 'light',
},
+ trigger: {
+ type: String,
+ default: 'click',
+ },
actions: {
type: Array,
default: () => [],
@@ -159,6 +162,7 @@ export default createComponent({
teleport={props.teleport}
transition="van-popover-zoom"
lockScroll={false}
+ onClick={stopPropagation}
onTouchstart={onTouchstart}
{...{ ...attrs, 'onUpdate:show': toggle }}
>
diff --git a/src/popover/test/index.spec.js b/src/popover/test/index.spec.js
index e60b18219..58c47b624 100644
--- a/src/popover/test/index.spec.js
+++ b/src/popover/test/index.spec.js
@@ -11,6 +11,7 @@ test('should toggle popover when trigger is "click" and the reference element is
const wrapper = mount(Popover, {
props: {
show: true,
+ trigger: 'manual',
},
slots: {
reference: () =>
,