fix(popup,menu): 修复 popup组件update:visible事件重复调用与menu 组件close 事件在小程序中无…

…法触发 (#205) closed #196
nutui-uniapp · Feb 29, 2024 · 0ce7d69 · 0ce7d69
1 parent fba3477
commit 0ce7d69
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 16 deletions.
diff --git a/packages/nutui/components/menuitem/menuitem.vue b/packages/nutui/components/menuitem/menuitem.vue
@@ -139,7 +139,8 @@ export default defineComponent({
       :lock-scroll="parent?.props.lockScroll"
       :close-on-click-overlay="parent?.props.closeOnClickOverlay"
       @closed="handleClose"
-      @update:visible="handleVisible"
+      @open="handleVisible(true)"
+      @close="handleVisible(false)"
     >
       <scroll-view :scroll-y="true">
         <view id="nut-menu-item__content" class="nut-menu-item__content">

diff --git a/packages/nutui/components/popup/use-popup.ts b/packages/nutui/components/popup/use-popup.ts
@@ -8,6 +8,7 @@ const initIndex = 500
 let _zIndex = initIndex
 const componentName = `${PREFIX}-popup`
 export function usePopup(props: PopupProps, emit: SetupContext<PopupEmits>['emit']) {
+  let opened: boolean
   const state = reactive({
     zIndex: props.zIndex,
     showSlot: true,
@@ -36,21 +37,25 @@ export function usePopup(props: PopupProps, emit: SetupContext<PopupEmits>['emit
   })
 
   const open = () => {
-    if (props.zIndex !== initIndex)
-      _zIndex = Number(props.zIndex)
+    if (!opened) {
+      opened = true
+      if (props.zIndex !== initIndex)
+        _zIndex = Number(props.zIndex)
 
-    emit('update:visible', true)
-    state.zIndex = ++_zIndex
-    state.showSlot = true
+      emit(UPDATE_VISIBLE_EVENT, true)
+      state.zIndex = ++_zIndex
+      state.showSlot = true
 
-    emit(OPEN_EVENT)
+      emit(OPEN_EVENT)
+    }
   }
 
   const close = () => {
-    // if (props.visible)
-    //   return // 避免重复调用
-    emit(UPDATE_VISIBLE_EVENT, false)
-    emit(CLOSE_EVENT)
+    if (opened) {
+      opened = false
+      emit(UPDATE_VISIBLE_EVENT, false)
+      emit(CLOSE_EVENT)
+    }
   }
 
   const onClick = (e: Event) => {
@@ -60,15 +65,13 @@ export function usePopup(props: PopupProps, emit: SetupContext<PopupEmits>['emit
   const onClickCloseIcon = (e: Event) => {
     e.stopPropagation()
     emit('click-close-icon')
-    emit(UPDATE_VISIBLE_EVENT, false)
-    // close();
+    close()
   }
 
   const onClickOverlay = () => {
     emit('click-overlay')
     if (props.closeOnClickOverlay)
-      emit(UPDATE_VISIBLE_EVENT, false)
-      // close();
+      close()
   }
 
   const onOpened = () => {
@@ -85,7 +88,13 @@ export function usePopup(props: PopupProps, emit: SetupContext<PopupEmits>['emit
   watch(
     () => props.visible,
     (val) => {
-      val ? open() : close()
+      if (val && !opened)
+        open()
+
+      if (!val && opened) {
+        opened = false
+        emit('close')
+      }
     },
   )
   watchEffect(() => {