HarmonyOS 鸿蒙Next tab组件中普通page与webview page滚动交互差异 普通page上下滚动交互正常，webview page向上滚动正常但向下先滚外层page再回滚内容页

使用nestedScroll来实现嵌套

import web_webview from '@ohos.web.webview';

@Entry

@Component

struct Index {

  scroller: Scroller = new Scroller();

  mainController: web_webview.WebviewController = new web_webview.WebviewController();

  subController: web_webview.WebviewController = new web_webview.WebviewController();

  tabController: TabsController = new TabsController()

  build() {

    Flex({direction: FlexDirection.Column}) {

      Scroll(this.scroller) {

        Column(){

          Web({

            src: 'www.baidu.com',

            controller: this.mainController

          })

            .height(400)

            .width('100%')

          Column(){

            Text('TAB')

              .backgroundColor(Color.Brown)

              .height(40)

              .width('100%')

            Tabs({barPosition:BarPosition.Start, controller:this.tabController }) {

              TabContent() {

                Web({

                  src: 'https://basic.10jqka.com.cn/astockph/briefinfo/notice.html?code=300033&marketid=33',

                  controller: this.subController

                })

                  .nestedScroll({

                    scrollForward: NestedScrollMode.PARENT_FIRST,

                    scrollBackward: NestedScrollMode.SELF_FIRST

                  })

                  .height('100%')

              }.tabBar('公告1')

              TabContent(){

                Web({

                  src: 'https://basic.10jqka.com.cn/astockph/briefinfo/notice.html?code=300033&marketid=33',

                  controller: this.subController

                })

                  .nestedScroll({

                    scrollForward: NestedScrollMode.PARENT_FIRST,

                    scrollBackward: NestedScrollMode.SELF_FIRST

                  })

                  .height('100%')

              }.tabBar('公告2')

            }

            .vertical(false)

            .scrollable(true)

            .barMode(BarMode.Scrollable)

            .barHeight(40)

            .height('100%')

          }

          .height('100%')

        }

      }

    }

    .height('100%')

  }

}

在HarmonyOS鸿蒙系统中，Next tab组件内普通page与webview page的滚动交互差异主要由两者的渲染机制和事件处理逻辑不同导致。

普通page通常基于原生控件构建，其滚动事件由系统直接处理，响应迅速且流畅。因此，在上下滚动时，用户感受到的是直接作用于当前页面的滚动效果，无额外层级干扰。

而webview page则嵌入了一个基于Web技术的渲染引擎，用于加载和显示网页内容。由于Web内容的复杂性，其滚动事件处理需要同时考虑WebView内部的内容滚动和外层page的滚动。当用户尝试向下滚动时，系统可能首先判断为外层page的滚动意图，当滚动超出一定阈值或速度后，才将事件传递给WebView内部处理，导致先滚外层page再回滚内容页的现象。

这种差异源于技术架构的不同，而非简单的配置或代码调整所能解决。开发者在设计应用时，需充分考虑这一特性，通过合理的UI布局和交互设计，减少用户因滚动差异带来的困惑。

如果问题依旧没法解决请联系官网客服,官网地址是：https://www.itying.com/category-93-b0.html