首先按照官方文档写出html结构样式,
如下:
<div class="goodContent" ref="goodContent"> <div> <!-- 顶部提示信息 --> <div class="top-tip"> <span class="refresh-hook">下拉刷新</span> </div> <ul> <li v-for="(num,key) in 30" :key="key" @click='_numClick(key)'>{{num}}</li> <li v-for="(person,key) in persons" :key="key">{{person.name}}</li> </ul> <!-- 底部提示信息 --> <div class="bottom-tip"> <span class="loading-hook">加载更多</span> </div> </div> </div> 其中的提示信息视情况使用,这里要注意的是一定要给最外层的div添加个定位;没有定位将导致页面无法滑动;
然后就是按照官方文档给的接口去写你需要用到的方法,示例如下:
这里需要注意的是bscroll初始化的时候