web组件嵌套滚动在折叠屏展开后收起时其滚动位置会发生变化

展开时在底部，折起来就不在底部了。

HarmonyOS

superinsect

2024-11-06 10:45:57

浏览

回答 1

按赞同

按时间

zbw_apple

可以在list组件中使用嵌套滚动试下，参考代码：

import { router } from '@kit.ArkUI'; 
import web_webview from '@ohos.web.webview' 
 
@Entry 
@Component 
struct SxxActiveDetailPage { 
  private arr: number[] = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9] 
  @State articleUrl:string[]=[]; 
  controller: web_webview.WebviewController = new web_webview.WebviewController(); 
  private scroller: Scroller = new Scroller(); 
  @State urls:string[]=["https://xxx.huawei.com.cn/Activitysp/detail/signature/90kOgGYJapeMqy6DjdrZOrjuLCV90r1NQox234LKxxxBlb7R5/","https://xxx.huawei.com.cn/Activitysp/detail2/signature/90kOgGYJapeMqy6DjdrZOrjuLCV90r1NQox234LKWmXzBlb7R5/"] 
  aboutToAppear() { 
    //let routerParams = router.getParams() as CommonRouteParams 
    // this.articleUrl.push(routerParams.url) 
    // this.articleUrl.push(routerParams.url2) 
    // LogUtils.info("SxxActiveDetailPage",JSON.stringify(this.articleUrl)) 
  } 
  build() { 
    Column() { 
 
      Column() { 
        List({scroller:this.scroller}) { 
          ForEach(this.arr, (item: number) => { 
            ListItem() { 
              Text('' + item) 
                .width('100%').height(100).fontSize(16) 
                .textAlign(TextAlign.Center).borderRadius(10).backgroundColor(0xFFFFFF) 
            } 
          }, (item: string) => item) 
          ForEach(this.urls, (item: string) => { 
            ListItem() { 
              Web({ src: item, controller: this.controller,renderMode:RenderMode.SYNC_RENDER }) 
                .fileAccess(true) 
                .domStorageAccess(true) 
                .javaScriptAccess(true) 
                .imageAccess(true)//是否允许自动加载图片资源，默认允许。 
                .zoomAccess(true) 
                .databaseAccess(false)//设置是否开启数据库存储API权限 
                .verticalScrollBarAccess(false) 
                .layoutMode(WebLayoutMode.FIT_CONTENT) 
 
            }.width('100%') 
 
          }, (item: string) => JSON.stringify(item)) 
 
        } 
        .backgroundColor(Color.White) 
        .alignListItem(ListItemAlign.Start) 
      } 
      .alignItems(HorizontalAlign.Center) 
      .justifyContent(FlexAlign.Start) 
      .width('100%') 
      .height('100%')}}}1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.