上拉加载以及下拉刷新都是移动端很常见的功能，在搜索或者一些分类列表页面常常会用到。
跟横向滚动一样，我们还是采用better-scroll这个库来实现。由于better已经更新了新的版本，之前是0.几的版本，更新了一下发现，现在已经是1.2.6这个版本了，新版本多了些 比较好用的api，所以我也重写了之前的代码，用新的api来实现上拉加载以及下拉刷新。
首先把基本的样式写好，这里就略过了，然后引入better-scroll库
import BScroll from 'better-scroll'其次，在mounted生命周期实例化scroll,可以获取完数据后再new，也可以先new后，获取完数据调用refresh。
实例时需要传入一个配置参数，由于参数比较多，具体的请参考文档，这里只讲2个重点的：
//是否开启下拉刷新，可传入true或者false,如果需要更多配置可以传入一个对象pullDownRefresh：{
threshold:80,
stop:40
}
//是否开启上拉加载，同上，上拉无stop参数，这里需要注意是负数
pullUpLoad：{
threshold:-80,
}
/**
*
* @param threshold 触发事件的阀值，即滑动多少距离触发
* @param stop 下拉刷新后回滚距离顶部的距离（为了给loading留出一点空间）
*/
以上的数字个人感觉比较合适，但是这里有一个问题，由于我采用的是淘宝flexible.js来适配，这就导致：在安卓下80这个距离是合适的，但是到了iphone6s下，由于被缩放了3陪，所以现在80在iphone6s下就是27左右了。
所以，对于不同缩放程度的屏幕，还需要乘以对应的缩放比。
淘宝flexible.js里面其实已经有这个获取屏幕缩放比方法，这里直接从里面拿：
//在util.js里面加一个方法
export function getDeviceRatio(){
var isAndroid = window.navigator.appVersion.match(/android/gi);
var isIPhone = window.navigator.appVersion.match(/iphone/gi);
var devicePixelRatio = window.devicePixelRatio;
var dpr;
if (isIPhone) {
// iOS下，对于2和3的屏，用2倍的方案，其余的用1倍方案
if (devicePixelRatio >= 3) {
dpr = 3;
} else if (devicePixelRatio >= 2){
dpr = 2;
} else {
dpr = 1;
}
} else {
// 其他设备下，仍旧使用1倍的方案
dpr = 1;
}
return dpr
}
import{ DEVICE_RATIO} from '../base/js/api.js'
/*获取当前缩放比*/
const DEVICE_RATIO=getDeviceRatio(); /*下拉配置*/
const DOWN_CONFIG={
threshold:80*DEVICE_RATIO,
