【HarmonyOS NEXT】ListItemGroup中再次嵌套list，里层的list如何实现通过scroller滚动到指定index

【关键字】

ListItemGroup / 嵌套list / scroller / 标题悬停

【问题描述】

ListItemGroup中再次嵌套list，里层的list如何实现通过scroller滚动到指定index

场景示例代码结构如下：

List(){
ListItem()
ListItem()
ListItemGroup({ header: this.moreContentHead() }) {
ListItem(){
List()
}
}
}

ListItemGroup中的header是为了实现标题悬停效果，点击header中的指定项希望里层的list能滚动到指定位置，但是由于外层嵌套List无法实现这个效果。整体效果参照android的AppbarLayout，目标效果如下图所示。

【解决方案】

开发者您好，两个list嵌套，内部list没有高度因此无法设置跳转效果。

• 方案一：可以设置内部高度来实现

• 方案二：去掉内部的list等待上述所说的版本发布后使用scrollToItemInGroup方法实现

• 方案三：您可以将外部的list换成scroll，吸顶效果使用Tabs来实现，参考结构如下。

  Scroll(){
  Column(){
  ...
  Tabs({ barPosition: BarPosition.Start }){
  TabContent(){}.tabBar('预定行程')
  TabContent(){}.tabBar('旅游服务')
  ...
  }
  }
  }

  说明：如果TabContent中嵌套垂直滚动的list和外层scroll有滑动冲突，则嵌套滚动可以通过nestedScroll来解决。

  参考文档如下：https://developer.huawei.com/consumer/cn/doc/harmonyos-references/ts-container-scroll#ZH-CN_TOPIC_0000001893209673__%E7%A4%BA%E4%BE%8B3