uniapp滚动到顶部

### 实现 UniApp 页面滚动到顶部

在 UniApp 中实现页面滚动到顶部可以采用多种方法。一种常见的方式是通过 JavaScript 控制 `scroll-view` 组件的行为。

对于希望达到平滑滚动效果的情况，可以在点击某个按钮时触发函数，在该函数内部利用 `createSelectorQuery()` 方法获取当前页面的滚动位置并设置目标位置为零[^1]：

methods: {
    scrollToTop() {
        uni.pageScrollTo({
            scrollTop: 0,
            duration: 300 // 平滑滚动持续时间(ms)
        });
    }
}

如果项目中使用的是带有自定义导航栏的应用场景，并且想要配合 CSS 进行更细腻的操作（比如渐变透明度），则可以根据用户的滚动距离动态调整样式[^3]：

/* 定义初始状态 */
.nav-bar {
    background-color: rgba(255, 255, 255, v-bind('opacity'));
}

/* 设置最大不透明度 */
.max-opacity .nav-bar {
    background-color: rgba(255, 255, 255, 1);
}

当处理涉及复杂交互逻辑的需求时，如需确保每次都能正确响应到达底部的动作而不会因为嵌套组件影响默认行为，则需要注意配置好相应的参数以及合理安排事件监听器的位置[^2]。

为了更好地控制用户体验，建议开发者根据实际应用场景灵活选用上述提到的技术手段之一或组合使用它们来满足特定需求。