选项 / 高级
better-scroll 还支持一些高级配置,来实现一些特殊的 feature。
wheel
- 类型:Boolean | Object
- 默认值:false
- 作用:这个配置是为了做 picker 组件用的,默认为 false,如果开启则需要配置一个 Object,例如:
{selectedIndex: 0, rotate: 25, adjustTime: 400, wheelWrapperClass: 'wheel-scroll', wheelItemClass: 'wheel-item'}
。 - 备注:这是一个高级的配置,一般场景不需要配置,具体应用场景可见 Picker Demo 。想了解更多的细节可以去看 example 中的 picker 组件的代码。注意:如果配置为Object的时候wheelWrapperClass和wheelItemClass必须对应于你的实例better-scroll的wrapper类名和wrapper内的子类名。二者的默认值是"wheel-scroll"/"wheel-item",如果你不配置或者配置的名称和你对应DOM节点的类名不一致的话会导致一个问题:滚动起来的时候点击一下终止滚动并不会触发scrollEnd事件。进而影响诸如城市选择器联动数据的这种组件的结果
snap
- 类型:Boolean | Object
- 默认值:false
作用:这个配置是为了做 slide 组件用的,默认为 false,如果开启则需要配置一个 Object,例如:
snap: { loop: false, threshold: 0.1, stepX: 100, stepY: 100, easing: { style: 'cubic-bezier(0.25, 0.46, 0.45, 0.94)', fn: function(t) { return t * (2 - t) } } }
注意:loop 为 true 是为了支持横向循环轮播,并不支持纵向。
- 备注:这是一个高级的配置,一般场景不需要配置,具体应用场景可见 Slide Demo 。想了解更多的细节可以去看 example 中的 slide 组件的代码。
scrollbar
- 类型:Boolean | Object
- 默认值:false
- 作用:这个配置可以开启滚动条,默认为 false。当设置为 true 或者是一个 Object 的时候,都会开启滚动条,默认是会 fade 的,见 Demo 。了解更多的细节可以去看 example 中的 scroll 组件代码。
pullDownRefresh
- 类型:Boolean | Object
- 默认值:false
- 作用:这个配置用于做下拉刷新功能,默认为 false。当设置为 true 或者是一个 Object 的时候,可以开启下拉刷新,可以配置顶部下拉的距离(threshold) 来决定刷新时机以及回弹停留的距离(stop),见 Demo 。了解更多的细节可以去看 example 中的 scroll 组件代码。