u

code/base-project/base-vue/packages/ao-design/src/popup/index.tsx

@@ -17,8 +17,10 @@ import { getPrefixCls } from '../_utils/getPrefixCls'
 export default defineComponent({
   name: 'APopup',
   props: {
-    visible: { type: Boolean, default: false },
-
+    visible: {
+      type: Boolean,
+      default: false,
+    },
     trigger: {
       type: [String, Array] as PropType<
         'hover' | 'click' | 'focus' | 'contextMenu' | Array<'hover' | 'click' | 'focus' | 'contextMenu'>
@@ -65,8 +67,14 @@ export default defineComponent({
       type: [String, Object, Function] as unknown as () => string | VNode | (() => VNode),
       default: '',
     },
-    showDelay: { type: Number, default: 0 },
-    hideDelay: { type: Number, default: 0 },
+    showDelay: {
+      type: Number,
+      default: 0,
+    },
+    hideDelay: {
+      type: Number,
+      default: 0,
+    },
   },
   emits: ['update:visible'],
   setup(props, { slots, emit }) {
@@ -75,8 +83,8 @@ export default defineComponent({
     const triggerRef = ref<HTMLElement | null>(null) // 触发 引用
     const floatingRef = ref<HTMLElement | null>(null) // float 引用
     const arrowRef = ref<HTMLElement | null>(null) // 箭头引用
-    const localVisible = ref(props.visible)
-    const hasRendered = ref(props.visible)
+    const _visible = ref(props.visible)
+    const _rendered = ref(props.visible)
     // 定时器
     let showTimer: number | null = null
     let hideTimer: number | null = null
@@ -155,12 +163,12 @@ export default defineComponent({
     const showPopup = async () => {
       clearTimers()
       showTimer = window.setTimeout(async () => {
-        if (!hasRendered.value)
-          hasRendered.value = true
+        if (!_rendered.value)
+          _rendered.value = true
         await nextTick()
 
         fitFloatingWidth()
-        localVisible.value = true
+        _visible.value = true
         setupAutoUpdate()
         emit('update:visible', true)
       }, props.showDelay)
@@ -169,7 +177,7 @@ export default defineComponent({
     const hidePopup = async () => {
       clearTimers()
       hideTimer = window.setTimeout(() => {
-        localVisible.value = false
+        _visible.value = false
         clearAutoUpdate()
         emit('update:visible', false)
       }, props.hideDelay)
@@ -178,15 +186,15 @@ export default defineComponent({
     const togglePopup = async () => {
       clearTimers()
 
-      if (!hasRendered.value)
-        hasRendered.value = true
+      if (!_rendered.value)
+        _rendered.value = true
       await nextTick()
       fitFloatingWidth()
 
-      if (!localVisible.value) {
+      if (!_visible.value) {
         // 需要显示
         showTimer = window.setTimeout(async () => {
-          localVisible.value = true
+          _visible.value = true
           await nextTick()
           setupAutoUpdate()
           emit('update:visible', true)
@@ -195,7 +203,7 @@ export default defineComponent({
       else {
         // 需要隐藏
         hideTimer = window.setTimeout(() => {
-          localVisible.value = false
+          _visible.value = false
           clearAutoUpdate()
           emit('update:visible', false)
         }, props.hideDelay)
@@ -230,7 +238,7 @@ export default defineComponent({
       const triggerEl = getDOM(triggerRef.value)
       const floatingEl = getDOM(floatingRef.value)
       if (!triggerEl?.contains(target) && !floatingEl?.contains(target)) {
-        localVisible.value = false
+        _visible.value = false
       }
     }
 
@@ -296,7 +304,7 @@ export default defineComponent({
     })
 
     watch(() => props.visible, (val) => {
-      localVisible.value = val
+      _visible.value = val
     }, { immediate: true })
 
     const renderContent = (content: string | VNode | (() => VNode)) => {
@@ -310,8 +318,8 @@ export default defineComponent({
     return () => {
       // 懒加载
       const shouldRenderPopup = props.destroyOnClose
-        ? localVisible.value // 需要销毁时，只在显示时渲染
-        : localVisible.value || hasRendered.value // 不销毁时保持已渲染
+        ? _visible.value // 需要销毁时，只在显示时渲染
+        : _visible.value || _rendered.value // 不销毁时保持已渲染
 
       return (
         <>
@@ -332,7 +340,7 @@ export default defineComponent({
                   appear
                 >
                   <div
-                    v-show={localVisible.value}
+                    v-show={_visible.value}
                     ref={floatingRef}
                     class={[prefixCls, props.class]}
                     style={{