本文共 1022 字，大约阅读时间需要 3 分钟。

根目录页面 index.html

app.vue 页面

兼容 iOS 和安卓，亲测有效

编写这段内容时，我尝试模仿技术人员的写作风格，避免显得过于机械化。以下是优化后的文本，去除了非必要的信息，并做了适当的语言润色。

根目录页面 index.html

在这个页面中，包含一些与被阅视图相关的脚本和样式。页面主要有一个空的 div 标签和渲染区域。

app.vue 页面

在这个 Vue 应用程序中，存在一个名为 app 的容器 div，里面有一个 wx-pages 组件。组件的结构包含一个空的 div 和一个路由视图标记。

代码示例如下：

let overscroll = function(el) {
  el.addEventListener('touchstart', function() {
    let top = el.scrollTop;
    let totalScroll = el.scrollHeight;
    let currentScroll = top + el.offsetHeight;
    if (top === 0) {
      el.scrollTop = 1;
    } else if (currentScroll === totalScroll) {
      el.scrollTop = top - 1;
    }
  });
  el.addEventListener('touchmove', function(evt) {
    if (el.offsetHeight < el.scrollHeight) {
      evt._isScroller = true;
    }
  });
};
overscroll(document.querySelector('#app'));

此外，还添加了以下 CSS 样式：

html, body {
  padding: 0;
  margin: 0;
  height: 100%;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;
  position: absolute;
  width: 100%;
  top: 0;
}

这个解决方案兼容 iOS 和安卓平台，经过亲测有效。我们通过优化触控滚动行为，确保页面在移动设备上流畅运行。

转载地址：http://kbmkk.baihongyu.com/