两个LazyForeach的List如何组合在一起,并且支持懒加载

两个LazyForeach的List如何组合在一起,并且支持懒加载

HarmonyOS
2024-06-04 23:19:53
浏览
收藏 0
回答 1
待解决
回答 1
按赞同
/
按时间
xcbaby

1. 整个外层布局是一个Scroll,内存布局有两个List,上面是ListA,下面的是ListB,分别采取LazyForEach的方式加载数据。

2. ListA设置一个@BuilderParam参数,用于设置List上方的搜索及功能选项。第一个ListItem放父组件传递过来的UI插槽,后面是Lazy加载的ListItem。

3. 给ListA和ListB绑定nestedScroll属性。

示例代码:

@Entry 
@Component 
struct Combination { 
  @Builder 
  header() { 
    ... 
  } 
 
  builder() { 
    Column() { 
      Scroll() { 
        Column() {            
        ListA()            
        ListB()          
        } 
      } 
    } 
  } 
} 
 
@Component 
export struct ListA { 
  @Builder 
  FunBuilder() { 
  }; 
 
  @BuilderParam slot: () => void = this.FunBuilder; 
 
  build() { 
    Column() { 
      List() { 
        ListItem() { 
          this.slot(); 
        } 
 
        LazyForEach 
        ( 
           ... 
        ) 
      }.nestedScroll({ scrollForward: NestedScrollMode.SELF_FIRST, scrollBackward: NestedScrollMode.PARENT_FIRST }) 
    } 
  } 
 
  @Component export struct ListB {     
  build() { 
    Column() { 
      List() { 
        LazyForEach 
        ( 
           ... 
        ) 
      }.nestedScroll({ scrollForward: NestedScrollMode.PARENT_FIRST, scrollBackward: NestedScrollMode.SELF_FIRST }) 
    } 
  } 
}
分享
微博
QQ
微信
回复
2024-06-05 19:54:47
相关问题
LazyForEach加载原理是什么
924浏览 • 1回复 待解决
使用LazyForEach加载列表相关问题
377浏览 • 1回复 待解决
鸿蒙支持两个SPP server吗??? 20
582浏览 • 1回复 待解决
ArkTS开发如何比较两个string是否致 ?
3938浏览 • 3回复 待解决
开源书籍推荐,大家一起来学习下啊
4294浏览 • 1回复 待解决
关于数据库两个问题。
1112浏览 • 1回复 待解决
页面导航如何实现两个页面叠层
747浏览 • 1回复 待解决
两个设备控制相关问题
7869浏览 • 3回复 已解决
有谁知道如何合并两个对象
1167浏览 • 1回复 待解决
如何实现Fraction加载功能?
6188浏览 • 1回复 待解决
关于SQL查询两个表查询
1859浏览 • 1回复 待解决
PolarDB 默认有哪两个可用表空间?
1389浏览 • 1回复 待解决
页面导航如何实现A B两个页面叠层
292浏览 • 1回复 待解决
Tabs组件加载问题
918浏览 • 1回复 待解决