您现在的位置是:网站首页> 小程序设计

uniapp scoll-view必须要给高度才能触发滚动事件

摘要

<template>

<view>

<button type="primary" @click="change">{{text}}</button>

<my-footer></my-footer>

<scroll-view class="container" scroll-y="true" @scroll="scroll">

<view class="component2">

<text>component2</text>

</view>

</scroll-view>

</view>

</template>

<style>

page {

background-color: #FFFFFF;

height: 100%;

font-size: 11px;

line-height: 1.8;

}

.container{

width: 100%;

}

.component2 {

width: 100%;

height: 2000upx;

background-color: #999999;

}

</style>

滑动页面,控制台没有scroll方法的日志输出

原因:不同于Android的scrollview组件可以设置为包裹内容来适应子组件的高度,ReactNative、小程序、uni-app中的scrollview组件必须要有一个确定的发哦度才能正常工作,因为它实际上所做的就是将一系列不确定高度的子组件装进一个确定高度的容器(通过滚动操作)。

所以在scroll-view的样式.container中给个高度


Top