在uni-app中，当movable-area位于超过一屏高度的页面时，movable-view可能会跟随页面滚动，这通常是由于movable-area和movable-view的定位和布局设置不当导致的。为了解决这个问题，我们需要确保movable-area在页面中具有固定的定位，并且不受页面滚动的影响。以下是一个示例代码，展示了如何在uni-app中实现这一点。

首先，确保你的页面结构大致如下：

<template>
  <view class="container">
    <scroll-view scroll-y="true" style="height: 100vh;">
      <!-- 页面内容 -->
      <view class="page-content">
        <!-- 其他内容 -->
        <view class="fixed-area">
          <!-- movable-area 应该位于这个固定区域内 -->
          <movable-area class="movable-area">
            <movable-view class="movable-view" direction="all" inertia="{{true}}" out-of-bounds="{{true}}">
              <!-- movable-view 内容 -->
              <view>Drag me</view>
            </movable-view>
          </movable-area>
        </view>
        <!-- 其他内容 -->
      </view>
    </scroll-view>
  </view>
</template>

接下来，是对应的样式设置：

<style>
.container {
  position: relative;
  width: 100%;
  height: 100%;
}

.scroll-view {
  height: 100vh; /* 确保滚动视图占满整个视口高度 */
  overflow: auto;
}

.page-content {
  padding-bottom: 100px; /* 为固定区域留出空间，防止被滚动覆盖 */
}

.fixed-area {
  position: fixed; /* 固定定位，不受滚动影响 */
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px; /* 固定区域的高度 */
  background-color: #fff; /* 背景色，可根据需要调整 */
}

.movable-area {
  width: 100%;
  height: 100%;
}

.movable-view {
  width: 50px;
  height: 50px;
  background-color: red;
  border-radius: 50%;
}
</style>

在这个例子中，.fixed-area使用了position: fixed;来确保它始终位于视口的底部，并且不受页面滚动的影响。movable-area被包含在.fixed-area中，因此movable-view也不会随页面滚动。同时，通过调整.page-content的padding-bottom来确保内容不会被固定的.fixed-area覆盖。

这种方法可以有效地解决movable-view在滚动页面中的跟随滚动问题，同时保持movable-view在固定区域内的可拖动性。