uniapp禁止页面滚动

您可以通过在需要禁止滚动的页面的 `onLoad` 函数中添加如下代码来实现禁止页面滚动：

onLoad() {
  uni.setStorageSync('scrollTop', 0); // 保存滚动位置
  uni.pageScrollTo({
    scrollTop: 0, // 滚动到顶部
    duration: 0 // 没有动画
  });
  uni.disableScroll(); // 禁止页面滚动
},
onUnload() {
  uni.enableScroll(); // 恢复页面滚动
  let scrollTop = uni.getStorageSync('scrollTop');
  if (scrollTop) {
    uni.pageScrollTo({
      scrollTop,
      duration: 0
    });
    uni.removeStorageSync('scrollTop');
  }
}

这段代码中，我们通过 `uni.disableScroll()` 禁止了页面滚动，并且在页面销毁时调用 `uni.enableScroll()` 来恢复页面滚动。同时，我们还通过 `uni.pageScrollTo()` 将页面滚动到顶部，并且在页面销毁时根据之前保存的滚动位置来恢复页面滚动位置。

相关问题

uniapp禁止页面上下滚动

在uniapp中禁止页面上下滚动可以通过以下两种方式实现：

1. 在 `App.vue` 中加入以下代码：

<template>
  <div>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  mounted() {
    // 禁止页面上下滚动
    document.body.style.overflow = 'hidden';
  },
  beforeDestroy() {
    // 恢复页面上下滚动
    document.body.style.overflow = 'auto';
  }
}
</script>

2. 在需要禁止滚动的页面中加入以下代码：

<template>
  <div class="scroll-wrapper">
    <!-- 页面内容 -->
  </div>
</template>

<script>
export default {
  mounted() {
    // 禁止页面上下滚动
    document.querySelector('.scroll-wrapper').addEventListener('touchmove', function (e) {
      e.preventDefault();
    }, { passive: false });
  },
  beforeDestroy() {
    // 恢复页面上下滚动
    document.querySelector('.scroll-wrapper').removeEventListener('touchmove', function (e) {
      e.preventDefault();
    }, { passive: false });
  }
}
</script>

<style>
.scroll-wrapper {
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  height: 100%;
}
</style>

第二种方法比第一种方法更灵活，可以在需要禁止滚动的页面中单独控制。

uniapp如何禁止页面滚动

你可以通过在页面的 `onLoad` 生命周期函数中设置 `disableScroll` 属性来禁止页面滚动。具体代码如下：

onLoad: function () {
  uni.setNavigationBarTitle({
    title: '页面标题'
  });
  uni.showLoading({
    title: '加载中...'
  });
  //禁止页面滚动
  uni.setStorageSync('disableScroll', true);
},

在需要恢复页面滚动时，你可以通过设置 `disableScroll` 属性为 `false` 来实现。