From 90ca2535ec02663f87e13e8761295ff7e5e8781e Mon Sep 17 00:00:00 2001
From: whycq <you@example.com>
Date: 星期四, 22 九月 2022 19:27:52 +0800
Subject: [PATCH] #
---
pages/user/user.vue | 82 ++++++++++++++++++++++++++++++++++++++++
components/y-popup/y-popup.vue | 36 +++++++++++++-----
2 files changed, 107 insertions(+), 11 deletions(-)
diff --git a/components/y-popup/y-popup.vue b/components/y-popup/y-popup.vue
index 0be687d..36e718d 100644
--- a/components/y-popup/y-popup.vue
+++ b/components/y-popup/y-popup.vue
@@ -1,11 +1,18 @@
<template>
- <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>
+ <view v-if="showPopup" class="y-popup-mask">
+ <uni-transition key="1" mode-class="fade" :styles="maskClass" :show="show" @click="onTap"/>
+ <uni-transition key="2" :styles="transClass" :show="showTrans">
+
+ <view style="height: 70rpx;background-color: aliceblue;">title</view>
+ <scroll-view scroll-y class="scroll-Y">
+ <view style="width: 500rpx;height: 300rpx;background-color: aqua;">
+ <slot />
+ </view>
+ </scroll-view>
+ <view>
+ <button size="mini">鎸夐挳</button>
+ </view>
</uni-transition>
-
</view>
</template>
@@ -29,8 +36,16 @@
},
transClass: {
position: 'fixed',
- left: 0,
- right: 0
+ // left: 0,
+ // right: 0,
+ minWidth:'300rpx',
+ minHeight: '400rpx',
+ display: 'flex',
+ flexDirection: 'column',
+ alignItems: 'center',
+ borderRadius: '20rpx',
+ justifyContent: 'center',
+ backgroundColor: 'rgba(0, 255, 0, 0.4)'
},
}
@@ -44,7 +59,7 @@
close() {
this.showPopup = false
},
- onTop() {
+ onTap() {
this.showPopup = false
}
}
@@ -63,8 +78,9 @@
bottom: 0;
width: 100%;
height: 100vh;
- background-color: rgba(0, 0, 0, 0.4);
+ /* background-color: rgba(0, 0, 0, 0.4); */
z-index: 999;
+ border-radius: 20rpx;
}
.center {
display: flex;
diff --git a/pages/user/user.vue b/pages/user/user.vue
index ea3a7af..5831854 100644
--- a/pages/user/user.vue
+++ b/pages/user/user.vue
@@ -1,5 +1,6 @@
<template>
<view class="">
+ <scroll-view class="scroll-Y">
<button @click="open">鐐瑰嚮</button>
<y-popup ref="yPopup">
<!-- <view style="background-color: aqua;width: 100rpx;height: 100rpx;"></view>
@@ -74,6 +75,76 @@
<view class="vv">1</view>
<view class="vv">5</view>
</y-popup>
+ <view class="vv">100</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+
+ <view class="vv">100</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">5</view>
+ <view class="vv">100</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+ <view class="vv">66</view>
+
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">1</view>
+ <view class="vv">5</view>
+ </scroll-view>
</view>
</template>
@@ -81,7 +152,7 @@
export default {
data () {
return {
-
+ scrollY:true
}
},
methods: {
@@ -96,5 +167,14 @@
<style>
.vv {
width: 100%;height: 100rpx;
+
+ }
+ .bb {
+ position: fixed;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: 100%;
+ overflow: hidden;
}
</style>
\ No newline at end of file
--
Gitblit v1.9.1