https://blog.csdn.net/zhoulib__/article/details/107517651 微信小程序中使用scroll-view时,一般都是需要自行设置高度,因为不设置的话,显示的老小了,但是设置高度的话给一个定值也不合适,一般在移动端上面,界面通常是正好铺面当前的屏幕的大小,代码 主要使用 calc这个计算 css 首先获取当前scroll-view组件在屏幕中...
目前碰到scroll-view相关的问题一般都可以直接定位到没设置高度(或宽度),要么是设置了无效。 如果是没设置高度或宽度还好说,直接设置个差不多的高度就搞惦了,最怕的就是设置后无效,还死活看不出来原因。 比方说像我,硬是要冒天下之大不韪作死设置了scroll-view的百分比高度%,然后就死了——高度无效,无法滚动。...
需要设置高度，不设置高度相当于页面在滚动，去掉也不影响
高度设置的必要性: 在微信小程序中,scroll-view 组件需要显式设置高度(height),否则它将不会滚动,因为无法确定其滚动范围。这是由 scroll-view 的工作机制决定的,它需要一个确定的高度来计算滚动的起始和结束位置。 内容高度的限制: 直接限制:scroll-view 本身并不直接限制其内部内容的高度。它的滚动范围是基于其...
给scroll-view设置的高度得是具体高度,不能够是100%; 不用scroll-view组件,直接pageScroll(没有用这个是因为我实在去除不了原生scroll-bar的样式,我是废物😂不能让它消失。而且!没法给容器添加overflow-x: hidden; 添加了这个属性后下面就没法子用sticky。可是不用overflow-x的话页面就算width为100%也会横着滚)...
scroll-view中的item高度不一,所以没办法给一个固定的高度,但是不设置固定的高度就无法触发滑动监听bindscrolltoupper,请问有没有办法解决这个问题
如上图所示,官网明确提出了,scroll-view是需要设置固定高度的。 设置定高 按照官网的提示,我们来给scroll-view设置高度: <view> <view class="top">上</view> <scroll-view class="center" style="height:1100rpx" scroll-y="true"> 中 <block wx:for="{{100}}" wx:key="*this"> ...
可见,scroll-view位于页面的最下方,如果我直接给它设定一个固定的高度,那么在不同尺寸的屏幕上,就可能会有高度过小而在下方留白,或者高度过大超出屏幕下边界的可能。那么,自动计算scroll-view的高度,看起来是一个可行的办法。 思路有了,接下来就开始挑趁手的工具吧!
<scroll-view scroll-y style='height: {{scrollHeight + "px"}}'></<scroll-view> 复制代码 通过上面的方法使用。 注意:一定要在变量后面加上单位 px ,不加的话会出错。 以上就是精确计算微信小程序scrollview高度的方法,从此再也不担心 scroll-view 高度错乱了!