猿问

求大佬指点哈!关于vue,better-scroll pulldown触发问题,怎么解决?~求解答!

{{showMsg}}importBScrollfrom'better-scroll'exportdefault{data(){return{showMsg:'下拉刷新...',show:false,}},props:{probeType:{type:Number,default:1},click:{type:Boolean,default:true},listenScroll:{type:Boolean,default:true},data:{type:Array|Object,default:null},pullup:{type:Boolean,default:true},pulldown:{type:Boolean,default:true},beforeScroll:{type:Boolean,default:false},refreshDelay:{type:Number,default:20},pullUpLoad:{type:Boolean,default:true},msg:{type:String,default:''},pullDownRefresh:{type:Boolean|Object,default:true}},mounted(){setTimeout(()=>{this._initScroll()},20)},computed:{msgCol(){switch(this.msg){case'black':return`color:#2f2725`default:return`color:#fff`}}},methods:{_initScroll(){if(!this.$refs.wrapper){return}this.scroll=newBScroll(this.$refs.wrapper,{probeType:this.probeType,click:this.click,pullDownRefresh:{threshold:50,stop:20},pullUpLoad:{threshold:-50}})if(this.listenScroll){letme=thisthis.scroll.on('scroll',pos=>{if(pos.y>50){this.show=truethis.showMsg='加载中...'}})}if(this.pullup){//上拉加载this.scroll.on('pullingUp',()=>{console.log(111)this.$emit('nextPage')this.scroll.finishPullUp()this.scroll.refresh()})}if(this.pulldown){//下拉刷新this.scroll.on('pullingDown',(pos)=>{this.$emit('pulldown')})}if(this.beforeScroll){this.scroll.on('beforeScrollStart',()=>{this.$emit('beforeScroll')})}},disable(){this.scroll&&this.scroll.disable()},enable(){this.scroll&&this.scroll.enable()},refresh(){this.scroll&&this.scroll.refresh()},scrollTo(){this.scroll&&this.scroll.scrollTo.apply(this.scroll,arguments)},scrollToElement(){this.scroll&&this.scroll.scrollToElement.apply(this.scroll,arguments)}},watch:{data(){setTimeout(()=>{this.refresh()},this.refreshDelay)}}}" _ue_custom_node_="true">
拉丁的传说
浏览 2045回答 2
2回答

心有法竹

组件应该没啥问题,使用的时候得增加一些判断,防止重复请求。data(){return{isLoaded:false//以此来判断数据是否加载完了}},methods:{getNextPage(){//只有isLoaded为false的时候才去加载数据,这样不就不会重复去请求接口了if(!this.isLoaded){this.isLoaded=true//数据请求axios.get('/api/xxx').then(res=>{//请求成功了再将isLoaded变成false状态this.isLoaded=false}).error(err=>{//error同理this.isLoaded=false})}}}
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答