<template>
<view class="container flex_column">
<text>{{appear ? '小球出现' : '小球消失'}}</text>
<view class="page-section">
<scroll-view class="scroll-view" scroll-y>
<view class="scroll-area flex_column">
<text class="notice">向下滚动让小球出现</text>
<view class="ball"></view>
</view>
</scroll-view>
</view>
</view>
</template>
<style>
.scroll-view {
height: 400rpx;
background-color: #FFF;
border-color: #ccc;
border-width: 1px;
border-style: solid;
}
.scroll-area {
height: 1300rpx;
align-items: center;
}
.notice {
margin-top: 150rpx;
margin: 150rpx 0 400rpx 0;
}
.ball {
width: 200rpx;
height: 200rpx;
background-color: #1AAD19;
border-radius: 50px;
} </style>
0 个回复