diff --git a/src/components/x-dialog/index.vue b/src/components/x-dialog/index.vue
index 6dfbcc745..2efc14e99 100755
--- a/src/components/x-dialog/index.vue
+++ b/src/components/x-dialog/index.vue
@@ -3,10 +3,10 @@
     class="vux-x-dialog"
     :class="{'vux-x-dialog-absolute': layout === 'VIEW_BOX'}">
     <transition :name="maskTransition">
-      <div class="weui-mask" @click="hide" v-show="show" :style="maskStyle"></div>
+      <div class="weui-mask" @click="hide" v-show="dialogShow" :style="maskStyle"></div>
     </transition>
     <transition :name="dialogTransition">
-      <div :class="dialogClass" v-show="show" :style="dialogStyle">
+      <div :class="dialogClass" v-show="dialogShow" :style="dialogStyle">
         <slot></slot>
       </div>
     </transition>
@@ -65,6 +65,7 @@ export default {
     }
   },
   mounted () {
+    this.dialogShow = this.show
     if (typeof window !== 'undefined') {
       if (window.VUX_CONFIG && window.VUX_CONFIG.$layout === 'VIEW_BOX') {
         this.layout = 'VIEW_BOX'
@@ -73,13 +74,16 @@ export default {
   },
   watch: {
     show (val) {
-      this.$emit('update:show', val)
-      this.$emit(val ? 'on-show' : 'on-hide')
-      if (val) {
-        this.addModalClassName()
-      } else {
-        this.removeModalClassName()
-      }
+      setTimeout(() => {
+        this.dialogShow = val
+        this.$emit('update:show', val)
+        this.$emit(val ? 'on-show' : 'on-hide')
+        if (val) {
+          this.addModalClassName()
+        } else {
+          this.removeModalClassName()
+        }
+      }, 200)
     }
   },
   methods: {
@@ -101,7 +105,8 @@ export default {
   },
   data () {
     return {
-      layout: ''
+      layout: '',
+      dialogShow: ''
     }
   }
 }