组件库MintUI拉起加载更多插件Loadmoretips

jsimport{Loadmore}from"mint-ui";exportdefault{components:{"top-loadmore":Loadmore,},data(){return{page_num:1,bottomPullText:"上拉加载更多",}},methods:{loadList(){if(_this.page_num!=1){_this.$refs.loadmore.onBottomLoaded();//这里数据回调成功后，mt-loadmore的内部高度应该是reacquired防止拉取后不重置，不执行第一个请求或查询的第一页，防止头部滚动覆盖问题}},addMoreData(){if(this.flag)returnfalseif(this.totalPageNum>this.page_num){this.page_num++this.loadList()}this.$refs.loadmore.onBottomLoaded();//这里数据回调成功后，必须重新获取mt-loadmore的内部高度，防止上拉后重新设置.如果下拉刷新页面，需要执行：this.$refs.loadmore.onTopLoaded();},},}在上拉过程中，很容易触发列表的点击事件。修复需要修改两个文件：\node_modules\mint-ui\lib\mint-ui.common.js\node_modules\mint-ui\lib\loadmore\index.js修改内容：handleTouchEnd:functionhandleTouchEnd(event){if(this.direction==='down'&&this.getScrollTop(this.scrollEventTarget)===0&&this.translate>0){event.preventDefault();//点击此处防止滑动，自定义添加事件.stopPropagation();//点击这里防止滑动点击，自定义添加this.topDropped=true;if(this.topStatus==='drop'){this.translate='50';this.topStatus='加载中';这个.topMethod();}else{这个.translate='0';this.topStatus='拉';}}if(this.direction==='up'&&this.bottomReached&&this.translate<0){event.preventDefault();//这里要防止点击click停止滑动，自定义添加event.stopPropagation();//这里是点击防止滑动，自定义添加this.bottomDropped=true;this.bottomReached=false;if(this.bottomStatus==='drop'){this.translate='-50';this.bottomStatus='加载中';这个.bottomMethod();}else{this.translate='0';this.bottomStatus='拉';}}这。$emit('translate-change',this.translate);this.direction='';}