微信小程序scroll-view

使用竖向滚动时,需要给<scroll-view/>一个固定高度,通过 WXSS 设置 height。以下列举一个示例:


scroll-top的优先级要高于scroll-into-view的优先级



<!--pages/scroll_view/scroll_view.wxml-->
<scroll-view scroll-y='true' scroll-top='50' upper-threshold='50' style='height:200px;' bindscrolltoupper="scrolltoupper" bindscrolltolower="scrolltolower" scroll-with-animation='true' scroll-into-view="three" bindscroll="scroll">

<view style='background-color:red;height:100px;50px;'></view>
<view style='background-color:blue;height:100px;50px;'></view>
<view id='three' style='background-color:yellow;height:100px;50px;'></view>
<view style='background-color:green;height:100px;50px;'></view>

</scroll-view>


<scroll-view scroll-left="100" bindscrolltoupper="scrolltoupper" scroll-x='true' style='white-space: nowrap;display:flex;'>

<view style='background-color:red;height:100px;150px;display:inline-block;'></view>
<view style='background-color:blue;height:100px;150px;display:inline-block;'></view>
<view style='background-color:yellow;height:100px;150px;display:inline-block;'></view>
<view style='background-color:green;height:100px;150px;display:inline-block;'></view>

</scroll-view>






微信小程序视频教程


原文地址:https://www.cnblogs.com/coder306/p/13087657.html