鸿蒙开发 一 (九)、嵌套滚动，Scroll + List

今天整理一下一个常用但临时想起不来的场景，那就是嵌套滚动，有一个场景，大家一定见过：

我们使用Scroll 嵌套一个List，实现先用Scroll滚动，滚动到底部之后在让List滚动，一实战发现滚动不起来，实际上一个地方大家会忽略，就是当Scroll的高度大于屏幕时，才会发生滚动。那么应该这么写：

        Scroll(this.scroller) {
               Column() {
              
                 List(){
                        ......
                 }
                  .layoutWeight(1)
                    .nestedScroll({
                          scrollForward: NestedScrollMode.PARENT_FIRST, 
                          scrollBackward: NestedScrollMode.SELF_FIRST 
                    })
                }
                .height(`calc(${100}vp + 100%)`)
          }
          .id('videoLinkageListScroll')
          .layoutWeight(Constants.LAYOUT_WEIGHT)
          .scrollBar(BarState.Off)
          // 去除回弹效果，避免回弹时重复触发onReachEnd
          .edgeEffect(EdgeEffect.None)

其中两个重要的设置：

第一个是给List设置的嵌套滚动方式：

.nestedScroll({
       scrollForward: NestedScrollMode.PARENT_FIRST, 
       scrollBackward: NestedScrollMode.SELF_FIRST 
 })

第二个是给Scroll 的子布局设置的高度：

.height(`calc(${100}vp + 100%)`)

代表子布局的高是屏幕的100% + 100vp，那么Scroll 会先滚动100vp，然后List开始滚动

具体的业务还需要大家调整相应的参数，我只举个例子