feat(Popup): update demo

Tencent · Oct 12, 2022 · d26514d · d26514d
1 parent 2c37941
commit d26514d
Show file tree

Hide file tree

Showing 2 changed files with 6 additions and 3 deletions.
diff --git a/src/popup/__test__/__snapshots__/demo.test.jsx.snap b/src/popup/__test__/__snapshots__/demo.test.jsx.snap
@@ -136,7 +136,7 @@ exports[`Popup > Popup mobileVue demo works fine 1`] = `
           >
             <div
               class="t-overlay"
-              style="z-index: 1000; transition-duration: 300ms; display: none;"
+              style="background-color: rgba(0, 0, 0, 0.3); z-index: 1000; transition-duration: 300ms; display: none;"
             >
               
               
@@ -814,7 +814,7 @@ exports[`Popup > Popup placementTopVue demo works fine 1`] = `
       >
         <div
           class="t-overlay"
-          style="z-index: 1000; transition-duration: 300ms; display: none;"
+          style="background-color: rgba(0, 0, 0, 0.3); z-index: 1000; transition-duration: 300ms; display: none;"
         >
           
           

diff --git a/src/popup/demos/placement-top.vue b/src/popup/demos/placement-top.vue
@@ -3,7 +3,7 @@
     <div class="button-group">
       <t-button block variant="outline" size="large" @click="top = true">顶部弹出</t-button>
     </div>
-    <t-popup v-model="top" placement="top">
+    <t-popup v-model="top" placement="top" :overlay-props="overlayProps">
       <div style="height: 200px; background: #fff"></div>
     </t-popup>
   </div>
@@ -12,6 +12,9 @@
 <script lang="ts" setup>
 import { ref } from 'vue';
 
+const overlayProps = {
+  customStyle: `background-color: rgba(0,0,0,.3)`, // 自定义遮罩层样式
+};
 const top = ref(false);
 </script>