fix(Popup): resolved closeOnOverlayClick invalid and visibleChange ev…

…ent parameter error
Tencent · Aug 18, 2023 · 585ba87 · 585ba87
1 parent 295dfd3
commit 585ba87
Show file tree

Hide file tree

Showing 8 changed files with 15 additions and 25 deletions.
diff --git a/src/popup/__test__/__snapshots__/demo.test.js.snap b/src/popup/__test__/__snapshots__/demo.test.js.snap
@@ -5,7 +5,6 @@ exports[`Popup Popup base demo works fine 1`] = `
   <t-popup
     placement="top"
     visible=""
-    bind:visible-change="onVisibleChange"
   >
     <wx-view
       class="block block--"
@@ -99,9 +98,9 @@ exports[`Popup Popup base demo works fine 1`] = `
 exports[`Popup Popup custom-close demo works fine 1`] = `
 <custom-close>
   <t-popup
+    closeOnOverlayClick="{{false}}"
     placement="center"
     visible=""
-    bind:visible-change="onVisibleChange"
   >
     <wx-view
       class="block"
@@ -132,7 +131,6 @@ exports[`Popup Popup with-title demo works fine 1`] = `
   <t-popup
     placement="bottom"
     visible=""
-    bind:visible-change="onVisibleChange"
   >
     <wx-view
       class="block"

diff --git a/src/popup/_example/base/index.js b/src/popup/_example/base/index.js
@@ -22,10 +22,5 @@ Component({
         },
       );
     },
-    onVisibleChange(e) {
-      this.setData({
-        visible: e.detail.visible,
-      });
-    },
   },
 });
diff --git a/src/popup/_example/base/index.wxml b/src/popup/_example/base/index.wxml
@@ -1,4 +1,4 @@
-<t-popup visible="{{visible}}" bind:visible-change="onVisibleChange" placement="{{cur.value || 'top'}}">
+<t-popup visible="{{visible}}" placement="{{cur.value || 'top'}}">
   <view class="block block--{{cur.value}}">{{cur.text}}</view>
 </t-popup>
 

diff --git a/src/popup/_example/custom-close/index.js b/src/popup/_example/custom-close/index.js
@@ -22,11 +22,6 @@ Component({
         },
       );
     },
-    onVisibleChange(e) {
-      this.setData({
-        visible: e.detail.visible,
-      });
-    },
     onClose() {
       this.setData({
         visible: false,

diff --git a/src/popup/_example/custom-close/index.wxml b/src/popup/_example/custom-close/index.wxml
@@ -1,4 +1,4 @@
-<t-popup visible="{{visible}}" bind:visible-change="onVisibleChange" placement="center">
+<t-popup visible="{{visible}}" close-on-overlay-click="{{false}}" placement="center">
   <view class="block">
     <t-icon t-class="close-btn" name="close-circle" size="32" color="#fff" bind:tap="onClose" />
   </view>

diff --git a/src/popup/_example/with-title/index.js b/src/popup/_example/with-title/index.js
@@ -22,10 +22,5 @@ Component({
         },
       );
     },
-    onVisibleChange(e) {
-      this.setData({
-        visible: e.detail.visible,
-      });
-    },
   },
 });
diff --git a/src/popup/_example/with-title/index.wxml b/src/popup/_example/with-title/index.wxml
@@ -1,4 +1,4 @@
-<t-popup visible="{{visible}}" bind:visible-change="onVisibleChange" placement="bottom">
+<t-popup visible="{{visible}}" placement="bottom">
   <view class="block">
     <view class="header">
       <view class="btn btn--cancel" aria-role="button">取消</view>

diff --git a/src/popup/popup.ts b/src/popup/popup.ts
@@ -29,15 +29,22 @@ export default class Popup extends SuperComponent {
   };
 
   methods = {
+    setVisible(visible) {
+      this.setData({
+        visible,
+      });
+    },
+
     handleOverlayClick() {
       const { closeOnOverlayClick } = this.properties;
-      if (closeOnOverlayClick) {
-        this.triggerEvent('visible-change', { visible: false });
-      }
+      if (!closeOnOverlayClick) return;
+      this.setVisible(false);
+      this.triggerEvent('visible-change', { visible: false, trigger: 'overlay' });
     },
 
     handleClose() {
-      this.triggerEvent('visible-change', { visible: false });
+      this.setVisible(false);
+      this.triggerEvent('visible-change', { visible: false, trigger: 'close-btn' });
     },
   };
 }