目录

How do I resolve the nested scrolling conflicts between the Web and List components?

You can set the hitTestBehavior attribute of the component to avoid this problem. The following is an example:

import { webview } from '@kit.ArkWeb';

@Entry
@Component
struct SlidingConflictBetweenWebAndList {
  webviewController: webview.WebviewController = new webview.WebviewController();

  build() {
    List() {
      ListItem() {
        Web({
          src: $rawfile('index.html'),
          controller: this.webviewController
        })
          .width('100%')
          .height(220)
      }.hitTestBehavior(HitTestMode.Block)
      ListItem() {
        Web({
          src: $rawfile('index.html'),
          controller: this.webviewController
        })
          .width('100%')
          .height(220)
      }
      ListItem() {
        Text('1')
      }
      .height(220)
      ListItem() {
        Text('2')
      }
      .height(220)
    }
    .backgroundColor(Color.Blue)
    .width('100%')
    .height('100%')
  }
}

Reference

Hit Test Control