大连全瓷种植牙齿制作中心 发表于 2024-12-31 13:51:16

记uniapp 小步伐里scroll-view,@scroll事件,scroll-into-view不见效的原

原因: scroll-view的高度设的跟子元素所有元素高度一样

看代码:
<scroll-view scroll-y="true" class="scroll-view" @scroll="onScroll" scroll-into-view="#menu4">
        <view id="menu1" class="right-menu">1</view>
        <view id="menu2" class="right-menu">2</view>
        <view id="menu3" class="right-menu">3</view>
        <view id="menu4" class="right-menu">4</view>
        <view id="menu5" class="right-menu">5</view>
        <view id="menu6" class="right-menu">6</view>
        <view id="menu7" class="right-menu">7</view>
        <view id="menu8" class="right-menu">8</view>
        <view id="menu9" class="right-menu">9</view>
</scroll-view>
css代码
.scroll-view {
                        width: 100%;
                        height: 2700px;
                        .right-menu {
                                height: 300px;
                                background-color: pink;
                                border: 1px solid #000;
                        }
                }
好久没用了就忘记了,9个子元素一共2700px;失误把scroll-view的值也设成了2700px;这样就滑动不了了,因为不停没动;
修改:把scroll-view的高度改的小于子元素高度即可

.scroll-view {
                        width: 100%;
                        height: 900px;
                        .right-menu {
                                height: 300px;
                                background-color: pink;
                                border: 1px solid #000;
                        }
                }

免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。
页: [1]
查看完整版本: 记uniapp 小步伐里scroll-view,@scroll事件,scroll-into-view不见效的原