diff --git a/packages/mixins/popup/index.js b/packages/mixins/popup/index.js
index 912432a4d..777900ea6 100644
--- a/packages/mixins/popup/index.js
+++ b/packages/mixins/popup/index.js
@@ -186,6 +186,10 @@ export const PopupMixin = {
     },
 
     renderOverlay() {
+      if (this.$isServer || !this.value) {
+        return;
+      }
+
       if (this.overlay) {
         openOverlay(this, {
           zIndex: context.zIndex++,
diff --git a/packages/popup/test/index.spec.js b/packages/popup/test/index.spec.js
index be18b3b6f..7c1b9558d 100644
--- a/packages/popup/test/index.spec.js
+++ b/packages/popup/test/index.spec.js
@@ -117,6 +117,35 @@ test('render overlay', () => {
   expect(div.querySelector('.van-overlay')).toBeTruthy();
 });
 
+test('watch overlay prop', () => {
+  const div = document.createElement('div');
+  wrapper = mount({
+    template: `
+      <div>
+        <popup :value="show" :overlay="overlay" :get-container="getContainer" />
+      </div>
+    `,
+    components: {
+      Popup
+    },
+    data() {
+      return {
+        show: false,
+        overlay: false,
+        getContainer: () => div
+      };
+    }
+  });
+
+  expect(div.querySelector('.van-overlay')).toBeFalsy();
+
+  wrapper.setData({ overlay: true });
+  expect(div.querySelector('.van-overlay')).toBeFalsy();
+
+  wrapper.setData({ show: true });
+  expect(div.querySelector('.van-overlay')).toBeTruthy();
+});
+
 test('close on click modal', () => {
   const div = document.createElement('div');
   wrapper = mount({