diff --git a/src/popup/__test__/__snapshots__/demo.test.js.snap b/src/popup/__test__/__snapshots__/demo.test.js.snap
index 78b71e956..c8407b607 100644
--- 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
index f24ed9f1d..783a9d5ae 100644
--- 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
index afd9a94eb..c8aaab58a 100644
--- 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
index 3e2721517..8530d3f2e 100644
--- 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
index b3904cc43..86e7e813b 100644
--- 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
index f24ed9f1d..783a9d5ae 100644
--- 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
index 203792193..2dd8566f6 100644
--- 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
index c0b1534f0..a7488ed1f 100644
--- 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' });
     },
   };
 }