原因
在使用Scroll组件时,明明设置了滚动方向,内容也超过了视口范围,但是就是不能滚动,这是因为Scroll容器的子组件设置了width或height,Row不要设置width,Column不要设置height。
首先需要确保Scroll容器中只包含一个组件
@Entry
@Component
struct ScrollDemo {build() {Scroll(){Text('111').width('100%').height(200).backgroundColor(Color.Pink)Text('222').width('100%').height(1600).backgroundColor(Color.Orange)}}
}
可以发现并未展示第二个元素,这是因为Scroll容器中只允许一个子组件,那么使用一个容器组件将多个组件包裹即可。
@Entry
@Component
struct ScrollDemo {build() {Scroll(){Column(){Text('111').width('100%').height(200).backgroundColor(Color.Pink)Text('222').width('100%').height(1600).backgroundColor(Color.Orange)}}}
}
其次确保子组件不要设置width或height
Row容器主轴方向为水平方向,不要设置width。
Column容器主轴方向为竖直方向,不要设置height。