From b0991a8daf0369c12aa654270ce262250c29d68e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9C=40lihai=E2=80=9D?= <“2322873900@qq.com”>
Date: Sat, 4 Sep 2021 10:43:52 +0800
Subject: [PATCH 1/5] =?UTF-8?q?feat:=20=E5=88=9D=E5=A7=8B=E5=8C=96popover?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 devui/popover/index.ts                 | 19 +++++++++++++++++++
 devui/popover/src/popover-directive.ts | 13 +++++++++++++
 devui/popover/src/popover-types.ts     |  9 +++++++++
 devui/popover/src/popover.scss         |  3 +++
 devui/popover/src/popover.tsx          | 18 ++++++++++++++++++
 5 files changed, 62 insertions(+)
 create mode 100644 devui/popover/index.ts
 create mode 100644 devui/popover/src/popover-directive.ts
 create mode 100644 devui/popover/src/popover-types.ts
 create mode 100644 devui/popover/src/popover.scss
 create mode 100644 devui/popover/src/popover.tsx

diff --git a/devui/popover/index.ts b/devui/popover/index.ts
new file mode 100644
index 00000000..ac7d51d2
--- /dev/null
+++ b/devui/popover/index.ts
@@ -0,0 +1,19 @@
+import type { App } from 'vue'
+import Popover from './src/popover'
+import PopoverDirective from './src/popover-directive'
+
+Popover.install = function (app: App): void {
+  app.component(Popover.name, Popover)
+}
+
+export { Popover, PopoverDirective }
+
+export default {
+  title: 'Popover 悬浮提示',
+  category: '反馈',
+  status: '开发中', // TODO: 组件若开发完成则填入"已完成"，并删除该注释
+  install(app: App): void {
+    app.use(Popover as any)
+    app.directive('dPopover', PopoverDirective)
+  }
+}
diff --git a/devui/popover/src/popover-directive.ts b/devui/popover/src/popover-directive.ts
new file mode 100644
index 00000000..af4665aa
--- /dev/null
+++ b/devui/popover/src/popover-directive.ts
@@ -0,0 +1,13 @@
+// can export function.
+export default {
+  created(): void {
+    console.log('初始化');
+    
+  },
+  // beforeMount() { },
+  // mounted() { },
+  // beforeUpdate() { },
+  // updated() { },
+  // beforeUnmount() { },
+  // unmounted() { }
+}
diff --git a/devui/popover/src/popover-types.ts b/devui/popover/src/popover-types.ts
new file mode 100644
index 00000000..94fda413
--- /dev/null
+++ b/devui/popover/src/popover-types.ts
@@ -0,0 +1,9 @@
+import type { PropType, ExtractPropTypes } from 'vue'
+
+export const popoverProps = {
+  /* test: {
+    type: Object as PropType<{ xxx: xxx }>
+  } */
+} as const
+
+export type PopoverProps = ExtractPropTypes<typeof popoverProps>
diff --git a/devui/popover/src/popover.scss b/devui/popover/src/popover.scss
new file mode 100644
index 00000000..a2c73aa4
--- /dev/null
+++ b/devui/popover/src/popover.scss
@@ -0,0 +1,3 @@
+.d-popover {
+  //
+}
diff --git a/devui/popover/src/popover.tsx b/devui/popover/src/popover.tsx
new file mode 100644
index 00000000..19a8b0eb
--- /dev/null
+++ b/devui/popover/src/popover.tsx
@@ -0,0 +1,18 @@
+import './popover.scss'
+
+import { defineComponent } from 'vue'
+import { popoverProps, PopoverProps } from './popover-types'
+
+export default defineComponent({
+  name: 'DPopover',
+  props: popoverProps,
+  emits: [],
+  setup(props: PopoverProps, ctx) {
+    return {}
+  },
+  render() {
+    const {} = this
+
+    return <div class="d-popover"></div>
+  }
+})
-- 
Gitee


From 198d76e98f54b4ae66d119b0799789c87a4ab03e Mon Sep 17 00:00:00 2001
From: CatsAndMice <lihai_js@163.com>
Date: Sat, 4 Sep 2021 20:53:57 +0800
Subject: [PATCH 2/5] =?UTF-8?q?feat(popover):=20=E6=B7=BB=E5=8A=A0popover?=
 =?UTF-8?q?=E7=BB=84=E4=BB=B6=E4=B8=ADprops=E6=A0=A1=E9=AA=8C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 devui/popover/src/popover-types.ts | 31 ++++++++++++++++++++++++++----
 1 file changed, 27 insertions(+), 4 deletions(-)

diff --git a/devui/popover/src/popover-types.ts b/devui/popover/src/popover-types.ts
index 94fda413..3c0ec92e 100644
--- a/devui/popover/src/popover-types.ts
+++ b/devui/popover/src/popover-types.ts
@@ -1,9 +1,32 @@
-import type { PropType, ExtractPropTypes } from 'vue'
+import type { PropType, ExtractPropTypes, VNode } from 'vue'
 
 export const popoverProps = {
-  /* test: {
-    type: Object as PropType<{ xxx: xxx }>
-  } */
+  visible: {
+    type: Boolean,
+    default: false
+  },
+  content: {
+    type: [String, Object as PropType<() => VNode>],
+    default: ''
+  },
+
+  trigger: {
+    type: String,
+    default: 'click',
+    validator: function (value: string) {
+      return ['click', 'hover'].includes(value);
+    }
+  },
+  controlled: {
+    type: Boolean,
+    default: false
+  },
+
+  popType: {
+    type: String,
+    default: 'default'
+  }
+
 } as const
 
 export type PopoverProps = ExtractPropTypes<typeof popoverProps>
-- 
Gitee


From af1972bd95a5cbb1a9fffbc5ba7a7d8e34f4ca18 Mon Sep 17 00:00:00 2001
From: CatsAndMice <lihai_js@163.com>
Date: Sun, 5 Sep 2021 12:30:26 +0800
Subject: [PATCH 3/5] =?UTF-8?q?feat:=20popover=E5=B1=9E=E6=80=A7content?=
 =?UTF-8?q?=E5=AE=9A=E4=B9=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 devui/popover/index.ts                        |  2 +-
 devui/popover/src/directive.ts                |  6 +++++
 devui/popover/src/popover-directive.ts        | 13 -----------
 devui/popover/src/popover.tsx                 | 22 ++++++++++++-------
 .../src/{popover-types.ts => types.ts}        | 13 ++++-------
 sites/.vitepress/config/sidebar.ts            |  2 +-
 sites/components/popover/index.md             | 22 +++++++++++++++++++
 7 files changed, 48 insertions(+), 32 deletions(-)
 create mode 100644 devui/popover/src/directive.ts
 delete mode 100644 devui/popover/src/popover-directive.ts
 rename devui/popover/src/{popover-types.ts => types.ts} (59%)
 create mode 100644 sites/components/popover/index.md

diff --git a/devui/popover/index.ts b/devui/popover/index.ts
index ac7d51d2..d7535941 100644
--- a/devui/popover/index.ts
+++ b/devui/popover/index.ts
@@ -1,6 +1,6 @@
 import type { App } from 'vue'
 import Popover from './src/popover'
-import PopoverDirective from './src/popover-directive'
+import PopoverDirective from './src/directive'
 
 Popover.install = function (app: App): void {
   app.component(Popover.name, Popover)
diff --git a/devui/popover/src/directive.ts b/devui/popover/src/directive.ts
new file mode 100644
index 00000000..57b17196
--- /dev/null
+++ b/devui/popover/src/directive.ts
@@ -0,0 +1,6 @@
+import { createComponent, unmountComponent } from '../../shared/scripts/component';
+export default {
+  beforeMount(el, bind, vnode) {
+    console.log(el, bind, vnode);
+  },
+}
diff --git a/devui/popover/src/popover-directive.ts b/devui/popover/src/popover-directive.ts
deleted file mode 100644
index af4665aa..00000000
--- a/devui/popover/src/popover-directive.ts
+++ /dev/null
@@ -1,13 +0,0 @@
-// can export function.
-export default {
-  created(): void {
-    console.log('初始化');
-    
-  },
-  // beforeMount() { },
-  // mounted() { },
-  // beforeUpdate() { },
-  // updated() { },
-  // beforeUnmount() { },
-  // unmounted() { }
-}
diff --git a/devui/popover/src/popover.tsx b/devui/popover/src/popover.tsx
index 19a8b0eb..a7070af9 100644
--- a/devui/popover/src/popover.tsx
+++ b/devui/popover/src/popover.tsx
@@ -1,18 +1,24 @@
 import './popover.scss'
-
 import { defineComponent } from 'vue'
-import { popoverProps, PopoverProps } from './popover-types'
-
+import PropsPopover from './types';
 export default defineComponent({
   name: 'DPopover',
-  props: popoverProps,
-  emits: [],
-  setup(props: PopoverProps, ctx) {
+  props: {
+    ...PropsPopover
+  },
+  setup(props, ctx) {
     return {}
   },
+
   render() {
-    const {} = this
+    const { content, $slots } = this;
+    return (
+      <div class="d-popover">
+        <main class="devui-popover-content">
+          {$slots.content?.() || content}
+        </main>
 
-    return <div class="d-popover"></div>
+      </div>
+    )
   }
 })
diff --git a/devui/popover/src/popover-types.ts b/devui/popover/src/types.ts
similarity index 59%
rename from devui/popover/src/popover-types.ts
rename to devui/popover/src/types.ts
index 3c0ec92e..3caf83be 100644
--- a/devui/popover/src/popover-types.ts
+++ b/devui/popover/src/types.ts
@@ -1,12 +1,10 @@
-import type { PropType, ExtractPropTypes, VNode } from 'vue'
-
-export const popoverProps = {
+export default {
   visible: {
     type: Boolean,
     default: false
   },
   content: {
-    type: [String, Object as PropType<() => VNode>],
+    type: String,
     default: ''
   },
 
@@ -22,11 +20,8 @@ export const popoverProps = {
     default: false
   },
 
-  popType: {
+  propType: {
     type: String,
     default: 'default'
   }
-
-} as const
-
-export type PopoverProps = ExtractPropTypes<typeof popoverProps>
+}
diff --git a/sites/.vitepress/config/sidebar.ts b/sites/.vitepress/config/sidebar.ts
index 7c9f0f76..90940f5c 100644
--- a/sites/.vitepress/config/sidebar.ts
+++ b/sites/.vitepress/config/sidebar.ts
@@ -37,7 +37,7 @@ const sidebar = {
         { text: 'Loading 加载提示', link: '/components/loading/', status: '已完成' },
         { text: 'Mention 提及', link: '/components/mention/' },
         { text: 'Modal 模态弹窗', link: '/components/modal/' },
-        { text: 'Popover 悬浮提示', link: '/components/popover/' },
+        { text: 'Popover 悬浮提示', link: '/components/popover/',status:"开发中" },
         { text: 'ReadTip 阅读提示', link: '/components/read-tip/' },
         { text: 'Toast 全局通知', link: '/components/toast/', status: '已完成' },
         { text: 'Tooltip 提示', link: '/components/tooltip/' },
diff --git a/sites/components/popover/index.md b/sites/components/popover/index.md
new file mode 100644
index 00000000..caa53fa7
--- /dev/null
+++ b/sites/components/popover/index.md
@@ -0,0 +1,22 @@
+:::demo
+
+```vue
+<template>
+<d-popover content="popover">
+    <template >
+        <div>contentdev</div>
+    <template>
+</d-popover>
+</template>
+
+<script>
+import { defineComponent } from 'vue'
+export default defineComponent({
+  setup() {
+    return {
+     
+    }
+  },
+})
+</script>
+```
\ No newline at end of file
-- 
Gitee


From 9cbe01ff1ab947b63255ec7232718ebc840663f7 Mon Sep 17 00:00:00 2001
From: CatsAndMice <lihai_js@163.com>
Date: Mon, 6 Sep 2021 21:00:33 +0800
Subject: [PATCH 4/5] =?UTF-8?q?feat:=20=E5=AE=8C=E6=88=90popover=E5=90=91l?=
 =?UTF-8?q?eft=E5=BC=B9=E5=87=BA=E6=95=88=E6=9E=9C?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 devui/popover/index.ts            |  6 +--
 devui/popover/src/directive.ts    |  6 ---
 devui/popover/src/popover.scss    | 62 ++++++++++++++++++++++++++-
 devui/popover/src/popover.tsx     | 69 ++++++++++++++++++++++++-------
 devui/popover/src/types.ts        | 27 ------------
 sites/components/popover/index.md |  9 ++--
 6 files changed, 121 insertions(+), 58 deletions(-)
 delete mode 100644 devui/popover/src/directive.ts
 delete mode 100644 devui/popover/src/types.ts

diff --git a/devui/popover/index.ts b/devui/popover/index.ts
index d7535941..8325a36c 100644
--- a/devui/popover/index.ts
+++ b/devui/popover/index.ts
@@ -1,19 +1,17 @@
 import type { App } from 'vue'
 import Popover from './src/popover'
-import PopoverDirective from './src/directive'
 
 Popover.install = function (app: App): void {
   app.component(Popover.name, Popover)
 }
 
-export { Popover, PopoverDirective }
+export { Popover }
 
 export default {
   title: 'Popover 悬浮提示',
   category: '反馈',
   status: '开发中', // TODO: 组件若开发完成则填入"已完成"，并删除该注释
   install(app: App): void {
-    app.use(Popover as any)
-    app.directive('dPopover', PopoverDirective)
+    app.use(Popover as any);
   }
 }
diff --git a/devui/popover/src/directive.ts b/devui/popover/src/directive.ts
deleted file mode 100644
index 57b17196..00000000
--- a/devui/popover/src/directive.ts
+++ /dev/null
@@ -1,6 +0,0 @@
-import { createComponent, unmountComponent } from '../../shared/scripts/component';
-export default {
-  beforeMount(el, bind, vnode) {
-    console.log(el, bind, vnode);
-  },
-}
diff --git a/devui/popover/src/popover.scss b/devui/popover/src/popover.scss
index a2c73aa4..fc75768f 100644
--- a/devui/popover/src/popover.scss
+++ b/devui/popover/src/popover.scss
@@ -1,3 +1,61 @@
-.d-popover {
-  //
+@import '../../style/theme/color';
+@import '../../style//theme//corner';
+@import '../../style//theme/font';
+
+@mixin someDisplay {
+  display: inline-block;
+}
+$devui-popover-margin:-6px;
+$devui-popover-left:-8px;
+
+.devui-popover {
+  position: relative;
+  @include someDisplay;
+
+  &::after {
+    content: '';
+    width: 12px;
+    display: none;
+    height: 12px;
+    transform: rotate(45deg);
+    position: absolute;
+    background-color: $devui-feedback-overlay-bg;
+  }
+
+  .devui-popover-content {
+    position: absolute;
+    display: none;
+    padding: 5px 14px;
+    line-height: 1.5;
+    border-radius: $devui-border-radius-feedback;
+    transform: translateX(-100%);
+    color: $devui-feedback-overlay-text;
+    background-color: $devui-feedback-overlay-bg;
+    font-size: $devui-font-size-sm;
+  }
+
+  &.left {
+    .devui-popover-content {
+      left: $devui-popover-left;
+    }
+
+    &::after {
+      left: $devui-popover-left;
+      top: 50%;
+      margin-top: $devui-popover-margin;
+      margin-left: $devui-popover-margin;
+    }
+  }
+}
+
+.devui-popover {
+  &.devui-popover-isVisible {
+    .devui-popover-content {
+      @include someDisplay;
+    }
+
+    &::after {
+      @include someDisplay;
+    }
+  }
 }
diff --git a/devui/popover/src/popover.tsx b/devui/popover/src/popover.tsx
index a7070af9..398b41f0 100644
--- a/devui/popover/src/popover.tsx
+++ b/devui/popover/src/popover.tsx
@@ -1,24 +1,61 @@
 import './popover.scss'
-import { defineComponent } from 'vue'
-import PropsPopover from './types';
+import { defineComponent, toRefs, ref, CSSProperties } from 'vue'
 export default defineComponent({
   name: 'DPopover',
   props: {
-    ...PropsPopover
-  },
-  setup(props, ctx) {
-    return {}
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    position: {
+      type: [String, Array],
+      default: () => {
+        return ['top', 'right', 'bottom', 'left']
+      }
+    },
+    content: {
+      type: String,
+      default: ''
+    },
+
+    // trigger: {
+    //   type: String,
+    //   default: 'click',
+    //   validator: function (value: string) {
+    //     return ['click', 'hover'].includes(value);
+    //   }
+    // },
+
+    zIndex: {
+      type: Number as () => CSSProperties,
+      default: 1060
+    }
+
+
   },
 
-  render() {
-    const { content, $slots } = this;
-    return (
-      <div class="d-popover">
-        <main class="devui-popover-content">
-          {$slots.content?.() || content}
-        </main>
+  setup(props, ctx) {
+    const { position, content, zIndex } = toRefs(props);
+    const visible = ref(props.visible);
+    const onClick = function () {
+      visible.value = !visible.value;
+    }
 
-      </div>
-    )
-  }
+    return () => {
+      const { slots } = ctx;
+      const style: CSSProperties = {
+        zIndex: zIndex.value
+      }
+      return (
+        <div class={['devui-popover', position.value, { 'devui-popover-isVisible': visible.value }]}>
+          <div class='devui-popover-content' style={style}>
+            {slots.content?.() || content.value}
+          </div>
+          <div class="devui-popover-reference" onClick={onClick}>
+            {slots.reference?.() || content.value}
+          </div>
+        </div>
+      )
+    }
+  },
 })
diff --git a/devui/popover/src/types.ts b/devui/popover/src/types.ts
deleted file mode 100644
index 3caf83be..00000000
--- a/devui/popover/src/types.ts
+++ /dev/null
@@ -1,27 +0,0 @@
-export default {
-  visible: {
-    type: Boolean,
-    default: false
-  },
-  content: {
-    type: String,
-    default: ''
-  },
-
-  trigger: {
-    type: String,
-    default: 'click',
-    validator: function (value: string) {
-      return ['click', 'hover'].includes(value);
-    }
-  },
-  controlled: {
-    type: Boolean,
-    default: false
-  },
-
-  propType: {
-    type: String,
-    default: 'default'
-  }
-}
diff --git a/sites/components/popover/index.md b/sites/components/popover/index.md
index caa53fa7..607689d6 100644
--- a/sites/components/popover/index.md
+++ b/sites/components/popover/index.md
@@ -2,9 +2,12 @@
 
 ```vue
 <template>
-<d-popover content="popover">
-    <template >
-        <div>contentdev</div>
+<d-popover content="popover" position="left">
+    <template #content>
+      <span >我是内容</span>
+    </template>
+    <template #reference>
+        <d-button bsStyle="common">contentdev</d-button>
     <template>
 </d-popover>
 </template>
-- 
Gitee


From 10f290b910068da31938f0478da9dde80be2a4fd Mon Sep 17 00:00:00 2001
From: CatsAndMice <lihai_js@163.com>
Date: Sat, 11 Sep 2021 22:31:23 +0800
Subject: [PATCH 5/5] =?UTF-8?q?feat:=20=E5=AE=8C=E6=88=90hover=E5=B1=95?=
 =?UTF-8?q?=E7=A4=BA=E6=95=88=E6=9E=9C,=E4=BF=AE=E6=94=B9Dome=E4=BB=A3?=
 =?UTF-8?q?=E7=A0=81?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 devui/popover/src/popover.scss    | 31 +++++++++++++++++-
 devui/popover/src/popover.tsx     | 53 +++++++++++++++++++++----------
 sites/components/popover/index.md | 37 ++++++++++-----------
 3 files changed, 83 insertions(+), 38 deletions(-)

diff --git a/devui/popover/src/popover.scss b/devui/popover/src/popover.scss
index fc75768f..d229c000 100644
--- a/devui/popover/src/popover.scss
+++ b/devui/popover/src/popover.scss
@@ -5,6 +5,7 @@
 @mixin someDisplay {
   display: inline-block;
 }
+
 $devui-popover-margin:-6px;
 $devui-popover-left:-8px;
 
@@ -22,21 +23,49 @@ $devui-popover-left:-8px;
     background-color: $devui-feedback-overlay-bg;
   }
 
+  &.is-hover:hover::after {
+    @include someDisplay;
+  }
+
+  &.is-hover:hover .devui-popover-content {
+    @include someDisplay;
+  }
+
   .devui-popover-content {
     position: absolute;
     display: none;
     padding: 5px 14px;
     line-height: 1.5;
     border-radius: $devui-border-radius-feedback;
-    transform: translateX(-100%);
     color: $devui-feedback-overlay-text;
     background-color: $devui-feedback-overlay-bg;
     font-size: $devui-font-size-sm;
   }
+}
 
+.devui-popover {
   &.left {
     .devui-popover-content {
       left: $devui-popover-left;
+      top: 50%;
+      transform: translate(-100%, -50%);
+    }
+
+    &::after {
+      left: $devui-popover-left;
+      top: 50%;
+      margin-top: $devui-popover-margin;
+      margin-left: $devui-popover-margin;
+    }
+  }
+}
+
+.devui-popover {
+  &.left-top {
+    .devui-popover-content {
+      left: $devui-popover-left;
+      top: 0;
+      transform: translate(-100%, 0);
     }
 
     &::after {
diff --git a/devui/popover/src/popover.tsx b/devui/popover/src/popover.tsx
index 398b41f0..0fcfd6d1 100644
--- a/devui/popover/src/popover.tsx
+++ b/devui/popover/src/popover.tsx
@@ -1,14 +1,22 @@
 import './popover.scss'
 import { defineComponent, toRefs, ref, CSSProperties } from 'vue'
+import clickoutsideDirective from '../../shared/devui-directive/clickoutside'
+type positionType = 'top' | 'right' | 'bottom' | 'left'
+type triggerType = 'click' | 'hover'
 export default defineComponent({
   name: 'DPopover',
+
+  directives: {
+    clickoutside: clickoutsideDirective
+  },
+
   props: {
     visible: {
       type: Boolean,
       default: false
     },
     position: {
-      type: [String, Array],
+      type: [String as () => positionType, Array],
       default: () => {
         return ['top', 'right', 'bottom', 'left']
       }
@@ -18,27 +26,33 @@ export default defineComponent({
       default: ''
     },
 
-    // trigger: {
-    //   type: String,
-    //   default: 'click',
-    //   validator: function (value: string) {
-    //     return ['click', 'hover'].includes(value);
-    //   }
-    // },
+    trigger: {
+      type: String as () => triggerType,
+      default: 'click',
+    },
 
     zIndex: {
       type: Number as () => CSSProperties,
       default: 1060
     }
-
-
   },
 
   setup(props, ctx) {
-    const { position, content, zIndex } = toRefs(props);
     const visible = ref(props.visible);
-    const onClick = function () {
-      visible.value = !visible.value;
+    const { position, content, zIndex, trigger } = toRefs(props);
+    const isClick = trigger.value === 'click'
+    const event = function () {
+      if (visible.value) {
+        visible.value = false;
+        return
+      }
+      visible.value = true
+    }
+    const onClick = isClick ? event : null;
+    const onMouseenter = isClick ? null : () => { visible.value = true }
+    const onMouseleave = isClick ? null : () => { visible.value = false }
+    const hiddenContext = function () {
+      visible.value = false
     }
 
     return () => {
@@ -47,13 +61,18 @@ export default defineComponent({
         zIndex: zIndex.value
       }
       return (
-        <div class={['devui-popover', position.value, { 'devui-popover-isVisible': visible.value }]}>
+        <div class={['devui-popover',
+          position.value,
+          {
+            'devui-popover-isVisible': visible.value
+          }
+        ]}>
+          <div class='devui-popover-reference' onMouseenter={onMouseenter} onMouseleave={onMouseleave} onClick={onClick} v-clickoutside={hiddenContext}>
+            {slots.reference?.()}
+          </div>
           <div class='devui-popover-content' style={style}>
             {slots.content?.() || content.value}
           </div>
-          <div class="devui-popover-reference" onClick={onClick}>
-            {slots.reference?.() || content.value}
-          </div>
         </div>
       )
     }
diff --git a/sites/components/popover/index.md b/sites/components/popover/index.md
index 607689d6..97b69c2f 100644
--- a/sites/components/popover/index.md
+++ b/sites/components/popover/index.md
@@ -1,25 +1,22 @@
-:::demo
+# Popover 悬浮提示  
 
-```vue
-<template>
-<d-popover content="popover" position="left">
-    <template #content>
-      <span >我是内容</span>
+<d-popover content="popover" position="left-top"  visible>
+<!-- 使用v-slot缩写#报错，可能是与markdown语法冲突了 -->
+   <template v-slot:content>
+      <span >我是内容权scvsvsvs权根本</span>
     </template>
-    <template #reference>
-        <d-button bsStyle="common">contentdev</d-button>
-    <template>
+  <template v-slot:reference>
+    <d-button bsStyle="common">contentdev</d-button>
+  </template>
 </d-popover>
-</template>
 
-<script>
-import { defineComponent } from 'vue'
-export default defineComponent({
-  setup() {
-    return {
-     
-    }
-  },
-})
-</script>
+```html
+<d-popover content="popover" position="left-top"  visible>
+   <template v-slot:content>
+      <span >我是内容权scvsvsvs权根本</span>
+    </template>
+  <template v-slot:reference>
+    <d-button bsStyle="common">contentdev</d-button>
+  </template>
+</d-popover>
 ```
\ No newline at end of file
-- 
Gitee