可以利用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的高度，否则无法滚动。
