背景：
在移动端触发事件一般不用click 因为有延迟，一般用的是 touchstart （但是有问题，点击滑动都会触发）
所以用tap(只点击生效，滑动不生效) ，但是原生不支持
所以要用第三方的库来实现比如：zepto、vue-touch 、better-scroll（在iscroll之上再做了一层封装）、swiper
better-scroll
1、下载安装
cnpm i -S better-scroll
2、使用
注意：1、内容要足够多 能撑开(如图，橙色是内容)
2、要等数据获取到之后再使用better-croll
在使用的页面引入
import BScroll from ‘better-scroll‘;
数据加载完后实例化
参数：第一个参数是最外层dom，第二个是配置：tap等事件 的一个对象
xxxxxx.then(res=>{
var msg = res.data.msg;
if(msg===‘ok‘){
this.movieList = res.data.data.films;
this.$nextTick(()=>{
});
}
})
不得不说nextTick了，因为数据是异步请求过来的，bs需要等数据加载渲染页面后才能实例化，所以正式nextTick使用场景
1、在ul列表中和data 添加 提示字段
<li>{{ pullDowmMsg }}</li>
2、在bs第二个配置参数 添加
probeType: 1, // 滚动的时候会派发scroll事件，会截流
3、scroll 事件滑动触发，scrollEnd滑动结束后触发
scroll.on("scroll", (pos) => { if (pos.y > 30) { //pos是位置 pos.y是高度 this.pullDowmMsg = "正在更新中"; } }); scroll.on("touchEnd", (pos) => { if (pos.y > 30) { this.$axios({ url: "https://m.maizuo.com/gateway?cityId=350200&pageNum=1&pageSize=11&type=1&k=8679068", headers: { "X-Client-Info": ‘{"a":"3000","ch":"1002","v":"5.0.4","e":"1616165493940859830829057"}‘, "X-Host": "mall.film-ticket.film.list", }, }).then((res) => { var msg = res.data.msg; if (msg === "ok") { this.pullDowmMsg = "更新成功"; setTimeout(() => { this.movieList = res.data.data.films; this.pullDowmMsg = ""; },1000); } }); } });
on()函数用于为指定元素的 一个或多个事件 绑定事件处理函数
原文：https://www.cnblogs.com/zhuangdd/p/14642796.html