微信小程序 scroll-view 组件

scroll-view 是微信小程序原生组件,该组件可以创建一个横向或纵向的移动区域.最常见的例子就是根据首字母选择城市,相信大家都见过.

最近用到这个组件遇到一些坑,记录下.

上代码

wxml代码
wxss代码 js代码

坑1 :使用竖向滚动时，需要给<scroll-view/>一个固定高度 原因很简单,只有组件的内容超过组件的高度时,组件才会出现滚动条的.

坑2:scroll-into-view 该属性可以跳跃到指定的 <scroll-view/>里边任意子标签的位置,前提是每个<scroll-view/>组件的字标签必须有id这个属性

scroll-into-view跳转的也是id的值,这还不算结束,特别注意的是,scroll-into-view的值,必须是动态赋值的,不可以写死,否则不生效.

最后附录 官方文档 https://developers.weixin.qq.com/miniprogram/dev/component/scroll-view.html