uni-app 上面一个view 高度为100rpx 怎么设置下面的scroll-view 竖向沾满剩余空间

要让`<scroll-view>`在竖向方向上充满父元素（即`.main`）剩下的空间，您可以按照以下步骤设置样式：

1. 给`.scroll-view`定义CSS样式，使其在`.main`内占据剩余高度并允许滚动：

   .scroll-view {
     flex: 1;         // 使用flex-grow来撑满剩余空间
     overflow-y: auto; // 允许垂直滚动
     height: 0;       // 初始设置为0，这样scroll-view不会立即显示内容
   }

2. 当`.scroll-view`的内容高度大于`.scroll-view`自身高度时，会触发滚动。为了实现滚动到顶部的效果，可以添加事件监听器`@scrolltolower`，如`handleScrollToLower`函数所示：

   <scroll-view scroll-top="scrollTop" scroll-y="true" class="scroll-view" @scrolltolower="handleScrollToLower">
     <!-- 这里放置滚动内容 -->
   </scroll-view>

其中，`scrollTop`变量可以通过JavaScript动态更新以控制滚动位置。

完整代码示例（包括HTML和CSS部分）如下：

<!-- HTML部分 -->
<view class="main">
  <view class="title">标题</view>
  <scroll-view scroll-top="scrollTop" scroll-y="true" class="scroll-view" @scrolltolower="handleScrollToLower">
    <!-- 这里放置滚动内容 -->
  </scroll-view>
</view>

<!-- CSS部分 -->
<style scoped>
.main {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.title {
  height: 100rpx;
}

.scroll-view {
  flex: 1; /* 撑满剩余高度 */
  overflow-y: auto;
  height: 0; /* 初始设置为0 */
}
</style>