#

whycq

2022-09-21 38e46364dd1974997bb4a57e5ad9d22627969981

 components/y-popup/y-popup.vue

@@ -1,10 +1,11 @@
<template>
   <view v-if="showPopup" class="y-popup-mask" @tap="onTop">
      <view class="center">
         <scroll-view scroll-y="true"  class="" style="max-height: 80vh;">
               <slot/>
         </scroll-view>
      </view>
   <view v-if="showPopup">
      <uni-transition key="1" mode-class="fade" :styles="maskClass" :show="show" @click="onTop"/>
      <uni-transition key="2" :mode-class="ani" name="content" :styles="transClass" :duration="duration" :show="showTrans" >
         qqq<view style="width: 500rpx;height: 300rpx;background-color: aliceblue;position: absolute;top: 0;
         left: 0;"><slot /></view>
      </uni-transition>
		
   </view>
</template>

@@ -13,12 +14,32 @@
      name: 'y-popup',
      data() {
         return {
            show:false,
            showPopup:false,
            showTrans: false,
            duration: 300,
            ani: [],
            maskClass: {
               position: 'fixed',
               bottom: 0,
               top: 0,
               left: 0,
               right: 0,
               backgroundColor: 'rgba(0, 0, 0, 0.4)'
            },
            transClass: {
               position: 'fixed',
               left: 0,
               right: 0
            },
				
         }
      },
      methods: {
         open(direction) {
            this.showPopup = true
            this.show = true
            this.showTrans = true
         },
         close() {
            this.showPopup = false