上拉加载已经到底部了,却没有出现上拉加载
<PullToRefresh className="xm-pull-to-refresh" direction="up" refreshing={loading} onRefresh={onRefresh} indicator={{ activate: '松开立即刷新', release: <CircularProgress size={24} />, deactivate: '下拉可刷新', finish: '刷新完成' }} damping={150} > <div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>4589</div> </div> </PullToRefresh>
找到原因是 scrollTop 获取的是小数,而clientHeight 获取的是整数导致的




随着市面上各种高分屏,高DPI,都会出现这样的问题
上拉加载已经到底部了,却没有出现上拉加载
<PullToRefresh className="xm-pull-to-refresh" direction="up" refreshing={loading} onRefresh={onRefresh} indicator={{ activate: '松开立即刷新', release: <CircularProgress size={24} />, deactivate: '下拉可刷新', finish: '刷新完成' }} damping={150} > <div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>45</div> <div style={{ height: '2rem' }}>4589</div> </div> </PullToRefresh>找到原因是 scrollTop 获取的是小数,而clientHeight 获取的是整数导致的
随着市面上各种高分屏,高DPI,都会出现这样的问题