vue移動端better-scrollプラグインのアップロード完了

better-scrollは、ドロップダウン・リフレッシュとアップロードを行うのに特に便利です.vue-cliで直接コピーできる手順:一、better-scrollをダウンロードする

	npm install better-scroll -S

二、コンポーネントの導入

	


	
	import BScroll from 'better-scroll'
	export default {
	    data(){
	        return{
	            dropDown:false,
	          up:false,
        list:[1,2,3,4,5,6,6,7,8,9,10,11,12,13,14,15,1,2,3,4,5,6,6,7,8,9,10,11,12,13,14,15]
    }
},
mounted(){
    this.scrollFn()
},
methods:{
    scrollFn(){
        this.$nextTick(() => {
            if (!this.scroll) {
                this.scroll = new BScroll(this.$refs.bscroll, {
                    click: true,
                    scrollY: true,
                    probeType: 3
                });
            }else{
                this.scroll.refresh();
            }
            this.scroll.on('scroll', (pos) => {
                console.log(pos.y,this.dropDown)
                //      50px           
                if(pos.y>50){
                    this.dropDown = true
                }else{
                    this.dropDown = false
                }
            })
            //touchEnd（        ）              
            this.scroll.on('touchEnd', (pos) => {
                //     
                if(pos.y > 50){
                    console.log("      ")
                    this.dropDown = false
                }
                //        >     +10       
                if(this.scroll.maxScrollY>pos.y+20){
                    console.log("    ")
                    this.up=true;
                     setTimeout(()=>{
                    //  refresh       scroll           
                    this.list.push(' ',' ',' ',' ',' ',' ',' ',' ',' ',' ')
                    this.scroll.refresh();
                    this.up=false;
                    },1000)
                   
                }
                console.log(this.scroll.maxScrollY+"   ----     "+pos.y)
            })
            console.log(this.scroll.maxScrollY)
        });
    }
}
}