可以利用uni-app自带的组件scroll-view，结合@scroll事件实现滚动时改变背景颜色的效果。

下面是一个示例代码：

<template><view style="background-color: {{bgColor}}"><scroll-view class="scroll-view" @scroll="onScroll"><view class="content"><!-- 页面内容 --></view></scroll-view></view>
</template><script>
export default {data() {return {bgColor: '#fff' // 初始背景色为白色}},methods: {onScroll(e) {// 获取滚动条位置const scrollTop = e.detail.scrollTop// 根据滚动条位置改变背景色if (scrollTop > 100) {this.bgColor = '#f5f5f5'} else {this.bgColor = '#fff'}}}
}
</script>

在<template>中，首先设置了一个view作为页面的根容器，并且将背景色绑定到了bgColor数据上。

接下来使用scroll-view作为滚动容器，并且注册了@scroll事件，当滚动时触发该事件。

在<script>中，定义了onScroll方法来处理滚动事件。获取当前滚动条的位置，当滚动条位置大于100时，将背景色改为灰色，否则为白色。

注意：需要在<style>中设置.content的高度，否则无法滚动。