diff --git a/example/pages/popup/index.js b/example/pages/popup/index.js index d040e499..d4f03e3b 100644 --- a/example/pages/popup/index.js +++ b/example/pages/popup/index.js @@ -11,6 +11,9 @@ Page({ } }, + onTransitionEnd() { + console.log(`You can't see me 🌚`); + }, toggle(type) { this.setData({ [`show.${type}`]: !this.data.show[type] diff --git a/example/pages/popup/index.wxml b/example/pages/popup/index.wxml index e68430f9..e5fc308a 100644 --- a/example/pages/popup/index.wxml +++ b/example/pages/popup/index.wxml @@ -4,6 +4,7 @@ show="{{ show.middle }}" custom-class="center" bind:close="togglePopup" + bind:transitionEnd="onTransitionEnd" > 内容 @@ -17,6 +18,7 @@ position="bottom" custom-class="bottom" bind:close="toggleBottomPopup" + bind:transitionEnd="onTransitionEnd" > 内容 @@ -28,6 +30,7 @@ overlay="{{ false }}" custom-class="top" bind:close="toggleTopPopup" + bind:transitionEnd="onTransitionEnd" > 内容 @@ -38,6 +41,7 @@ position="right" custom-class="right" bind:close="toggleRightPopup" + bind:transitionEnd="onTransitionEnd" > 关闭弹层 @@ -47,6 +51,7 @@ position="right" custom-class="right" bind:close="toggleRightPopup2" + bind:transitionEnd="onTransitionEnd" > 关闭弹层 diff --git a/packages/popup/README.md b/packages/popup/README.md index 9d8897a8..dedb72f3 100644 --- a/packages/popup/README.md +++ b/packages/popup/README.md @@ -62,6 +62,7 @@ Page({ |-----------|-----------|-----------| | bind:close | 蒙层关闭时触发 | - | | bind:click-overlay | 点击蒙层时触发 | - | +| bind:transitionEnd | 蒙层关闭后触发 | - | ### 外部样式类 diff --git a/packages/popup/index.ts b/packages/popup/index.ts index 4d12fad2..e295af84 100644 --- a/packages/popup/index.ts +++ b/packages/popup/index.ts @@ -53,6 +53,10 @@ VantComponent({ } }, + onTransitionEnd() { + !this.data.show && this.$emit('transitionEnd'); + }, + observeClass() { const { transition, position } = this.data; this.updateClasses(transition || position);