diff --git a/package.json b/package.json
index 480ac7961..ef3f8486f 100644
--- a/package.json
+++ b/package.json
@@ -121,7 +121,7 @@
     "vooks": "0.0.8",
     "vue": "^3.0.5",
     "vue-router": "^4.0.3",
-    "vueuc": "^0.1.2"
+    "vueuc": "^0.1.3"
   },
   "husky": {
     "hooks": {
diff --git a/src/popover/demos/enUS/index.demo-entry.md b/src/popover/demos/enUS/index.demo-entry.md
index 0e5d0c20d..67319c21e 100644
--- a/src/popover/demos/enUS/index.demo-entry.md
+++ b/src/popover/demos/enUS/index.demo-entry.md
@@ -29,6 +29,7 @@ manual-position
 | display-directive | `'if' \| 'show'` | `'if'` | The conditionally render directive to show popover content. `if` means using `v-if` to render content, `show` means using `v-show` to render content. |
 | duration | `number` | `200` | Popover vanish delay when trigger is `hover` |
 | filp | `boolean` | `true` | Whether to filp the popover when there is no space for current placement. |
+| overlap | `boolean` | `false` |  |
 | placement | `'top-start' \| 'top' \| 'top-end' \| 'right-start' \| 'right' \| 'right-end' \| 'bottom-start' \| 'bottom' \| 'bottom-end' \| 'left-start' \| 'left' \| 'left-end' \| ` | `'bottom'` |  |
 | raw | `boolean` | `false` | Whether to use no default styles. |
 | show-arrow | `boolean` | `true` |  |
diff --git a/src/popover/demos/enUS/placement.demo.md b/src/popover/demos/enUS/placement.demo.md
index 1920e05a9..91b9ccd08 100644
--- a/src/popover/demos/enUS/placement.demo.md
+++ b/src/popover/demos/enUS/placement.demo.md
@@ -1,8 +1,10 @@
 # Placement
 
 ```html
+<n-switch v-model:value="overlap" /> Overlap Trigger Element
+<n-divider />
 <div class="popover-grid">
-  <n-popover placement="top-start" trigger="click">
+  <n-popover :overlap="overlap" placement="top-start" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 1 / 1 / 2 / 2;">
         Top Start
@@ -10,13 +12,13 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="top" trigger="click">
+  <n-popover :overlap="overlap" placement="top" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 1 / 2 / 2 / 3;"> Top </n-button>
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="top-end" trigger="click">
+  <n-popover :overlap="overlap" placement="top-end" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 1 / 3 / 2 / 4;">
         Top End
@@ -24,7 +26,7 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="left-start" trigger="click">
+  <n-popover :overlap="overlap" placement="left-start" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 2 / 1 / 3 / 2;">
         Left Start
@@ -32,13 +34,13 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="left" trigger="click">
+  <n-popover :overlap="overlap" placement="left" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 3 / 1 / 4 / 2;"> Left </n-button>
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="left-end" trigger="click">
+  <n-popover :overlap="overlap" placement="left-end" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 4 / 1 / 5 / 2;">
         Left End
@@ -46,7 +48,7 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="right-start" trigger="click">
+  <n-popover :overlap="overlap" placement="right-start" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 2 / 3 / 3 / 4;">
         Right Start
@@ -54,7 +56,7 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="right" trigger="click">
+  <n-popover :overlap="overlap" placement="right" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 3 / 3 / 4 / 4;">
         Right
@@ -62,7 +64,7 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="right-end" trigger="click">
+  <n-popover :overlap="overlap" placement="right-end" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 4 / 3 / 5 / 4;">
         Right End
@@ -70,7 +72,7 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="bottom-start" trigger="click">
+  <n-popover :overlap="overlap" placement="bottom-start" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 5 / 1 / 6 / 2;">
         Bottom Start
@@ -78,7 +80,7 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="bottom" trigger="click">
+  <n-popover :overlap="overlap" placement="bottom" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 5 / 2 / 6 / 3;">
         Bottom
@@ -86,19 +88,27 @@
     </template>
     <div class="large-text">Oops!</div>
   </n-popover>
-  <n-popover placement="bottom-end" trigger="click">
+  <n-popover :overlap="overlap" placement="bottom-end" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 5 / 3 / 6 / 4;">
         Bottom End
       </n-button>
     </template>
-    <div class="large-text">Oops!</div>
+    <div class="large-text">Oops</div>
   </n-popover>
 </div>
 ```
 
-```script
-console.log('wow')
+```js
+import { ref } from 'vue'
+
+export default {
+  setup () {
+    return {
+      overlap: ref(false)
+    }
+  }
+}
 ```
 
 ```css
diff --git a/src/popover/demos/zhCN/index.demo-entry.md b/src/popover/demos/zhCN/index.demo-entry.md
index 84229d15f..92961002b 100644
--- a/src/popover/demos/zhCN/index.demo-entry.md
+++ b/src/popover/demos/zhCN/index.demo-entry.md
@@ -29,6 +29,7 @@ manual-position
 | display-directive | `'if' \| 'show'` | `'if'` | 条件渲染使用的指令，`if` 会让内容被使用 `v-if` 渲染，`show` 会让内容被使用 `v-show` 渲染 |
 | duration | `number` | `200` | 悬浮关闭弹出信息的延迟 |
 | filp | `boolean` | `true` | 是否在当前放置方式不能提供足够空间的时候调整弹出信息的位置 |
+| overlap | `boolean` | `false` |  |
 | placement | `'top-start' \| 'top' \| 'top-end' \| 'right-start' \| 'right' \| 'right-end' \| 'bottom-start' \| 'bottom' \| 'bottom-end' \| 'left-start' \| 'left' \| 'left-end' \| ` | `'bottom'` |  |
 | raw | `boolean` | `false` | 是否不添加默认样式 |
 | show-arrow | `boolean` | `true` |  |
diff --git a/src/popover/demos/zhCN/placement.demo.md b/src/popover/demos/zhCN/placement.demo.md
index 68f14e3d9..ed5343b9c 100644
--- a/src/popover/demos/zhCN/placement.demo.md
+++ b/src/popover/demos/zhCN/placement.demo.md
@@ -1,8 +1,10 @@
 # 位置
 
 ```html
+<n-switch v-model:value="overlap" /> 覆盖触发元素
+<n-divider />
 <div class="popover-grid">
-  <n-popover placement="top-start" trigger="click">
+  <n-popover :overlap="overlap" placement="top-start" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 1 / 1 / 2 / 2;">
         Top Start
@@ -10,13 +12,13 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="top" trigger="click">
+  <n-popover :overlap="overlap" placement="top" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 1 / 2 / 2 / 3;"> Top </n-button>
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="top-end" trigger="click">
+  <n-popover :overlap="overlap" placement="top-end" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 1 / 3 / 2 / 4;">
         Top End
@@ -24,7 +26,7 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="left-start" trigger="click">
+  <n-popover :overlap="overlap" placement="left-start" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 2 / 1 / 3 / 2;">
         Left Start
@@ -32,13 +34,13 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="left" trigger="click">
+  <n-popover :overlap="overlap" placement="left" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 3 / 1 / 4 / 2;"> Left </n-button>
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="left-end" trigger="click">
+  <n-popover :overlap="overlap" placement="left-end" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 4 / 1 / 5 / 2;">
         Left End
@@ -46,7 +48,7 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="right-start" trigger="click">
+  <n-popover :overlap="overlap" placement="right-start" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 2 / 3 / 3 / 4;">
         Right Start
@@ -54,7 +56,7 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="right" trigger="click">
+  <n-popover :overlap="overlap" placement="right" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 3 / 3 / 4 / 4;">
         Right
@@ -62,7 +64,7 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="right-end" trigger="click">
+  <n-popover :overlap="overlap" placement="right-end" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 4 / 3 / 5 / 4;">
         Right End
@@ -70,7 +72,7 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="bottom-start" trigger="click">
+  <n-popover :overlap="overlap" placement="bottom-start" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 5 / 1 / 6 / 2;">
         Bottom Start
@@ -78,7 +80,7 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="bottom" trigger="click">
+  <n-popover :overlap="overlap" placement="bottom" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 5 / 2 / 6 / 3;">
         Bottom
@@ -86,7 +88,7 @@
     </template>
     <div class="large-text">啊！</div>
   </n-popover>
-  <n-popover placement="bottom-end" trigger="click">
+  <n-popover :overlap="overlap" placement="bottom-end" trigger="click">
     <template #trigger>
       <n-button size="small" style="grid-area: 5 / 3 / 6 / 4;">
         Bottom End
@@ -97,6 +99,18 @@
 </div>
 ```
 
+```js
+import { ref } from 'vue'
+
+export default {
+  setup () {
+    return {
+      overlap: ref(false)
+    }
+  }
+}
+```
+
 ```css
 .popover-grid {
   display: grid;
diff --git a/src/popover/src/Popover.ts b/src/popover/src/Popover.ts
index d02139942..38fced2b9 100644
--- a/src/popover/src/Popover.ts
+++ b/src/popover/src/Popover.ts
@@ -141,6 +141,10 @@ export const popoverProps = {
     type: Boolean,
     default: true
   },
+  overlap: {
+    type: Boolean,
+    default: false
+  },
   // events
   // eslint-disable-next-line vue/prop-name-casing
   'onUpdate:show': Function as PropType<
@@ -211,6 +215,10 @@ export default defineComponent({
     })
     // setup show-arrow
     const compatibleShowArrowRef = useCompitable(props, ['arrow', 'showArrow'])
+    const mergedShowArrowRef = computed(() => {
+      if (props.overlap) return false
+      return compatibleShowArrowRef.value
+    })
     // trigger
     let triggerVNode = null as VNode | null
     // bodyInstance
@@ -323,7 +331,7 @@ export default defineComponent({
       // if to show popover body
       uncontrolledShow: uncontrolledShowRef,
       mergedShow: mergedShowRef,
-      compatibleShowArrow: compatibleShowArrowRef,
+      mergedShowArrow: mergedShowArrowRef,
       setShow,
       handleClick,
       handleMouseEnter,
@@ -371,6 +379,7 @@ export default defineComponent({
             NPopoverBody,
             keep(this.$props, bodyPropKeys, {
               ...this.$attrs,
+              showArrow: this.mergedShowArrow,
               show: this.mergedShow
             }),
             slots
diff --git a/src/popover/src/PopoverBody.ts b/src/popover/src/PopoverBody.ts
index a5bf0b8fe..94f2126cd 100644
--- a/src/popover/src/PopoverBody.ts
+++ b/src/popover/src/PopoverBody.ts
@@ -38,6 +38,7 @@ export const popoverBodyProps = {
   x: Number,
   y: Number,
   filp: Boolean,
+  overlap: Boolean,
   placement: String as PropType<FollowerPlacement>,
   // private
   shadow: Boolean,
@@ -187,6 +188,7 @@ export default defineComponent({
                 class: [
                   'n-popover',
                   {
+                    'n-popover--overlap': this.overlap,
                     'n-popover--no-arrow': !this.showArrow,
                     'n-popover--shadow': this.shadow,
                     'n-popover--padded': this.padded,
@@ -231,7 +233,8 @@ export default defineComponent({
         y: this.y,
         placement: this.placement,
         containerClass: this.namespace,
-        ref: 'followerRef'
+        ref: 'followerRef',
+        overlap: this.overlap
       },
       {
         default: () => {
diff --git a/src/popover/src/styles/index.cssr.ts b/src/popover/src/styles/index.cssr.ts
index 8f00e7ab0..f29682954 100644
--- a/src/popover/src/styles/index.cssr.ts
+++ b/src/popover/src/styles/index.cssr.ts
@@ -155,6 +155,9 @@ function placementStyle (
         margin-${position}: var(--space);
         margin-${oppositePlacement[position]}: var(--space);
       `),
+      cM('overlap', `
+        margin: 0;
+      `),
       cB('popover-arrow-wrapper', `
         right: 0;
         left: 0;
diff --git a/vue3.md b/vue3.md
index 14c8a26a7..ef77b0a2b 100644
--- a/vue3.md
+++ b/vue3.md
@@ -230,6 +230,7 @@
 - [x] popover
   - new
     - `default-show`
+    - `overlap`
   - deprecate
     - `#activator` => `#trigger`
     - `overlay-xxx` => `body-xxx`