有没有使用vue封装mui 的上拉加载/下拉刷新的组件

我来给你粘贴一小段，只做了下拉效果，没有做数据载入部分，上拉更没有

@Component({  
  name: 'home',  
  components: {  
    Icons,  
    Numbers,  
    Immersed,  
    Devices,  
    Stats,  
    Toutiao  
  }  
})  
export default class App extends Vue {  
  show: any = {  
    welcome1: false,  
    welcome2: false,  
    welcome3: false,  
    stats: false,  
    devices: false,  
    toutiao: false  
  }  
  dragging: boolean = false  
  startY: number = 0  
  moveY: number = 0  
  moveL: number = 0  
  maxL: number = 0  

  startDrag (e: any) {  
    this.startY = e.touches[0].clientY  
    let scrollTop: number = document.documentElement.scrollTop  
    if (scrollTop <= 0) this.dragging = true  
  }  

  onDrag (e: any) {  
    this.moveY = e.touches[0].clientY  
    this.moveL = this.moveY - this.startY  
    if (this.dragging && this.moveL > 0) {  
      e.preventDefault()  
      $('body').classList.remove('touchend')  
      $('.mui-content').classList.remove('touchend')  
      $('.mui-content').style.marginTop = this.moveL < this.maxL  
        ? `${this.moveL}px` : `${this.maxL}px`  
      $('body').style.backgroundSize = this.moveL < this.maxL  
        ? (100 + (this.moveL / 10) + '% ') + (100 + (this.moveL / 10) + '%')  
        : (100 + (this.maxL / 10) + '% ') + (100 + (this.maxL / 10) + '%')  
    }  
  }  

  stopDrag (e: any) {  
    if (this.dragging) {  
      let muiContent = $('.mui-content')  
      let body = $('body')  
      let marginTop: number = muiContent.style.marginTop ? parseInt(muiContent.style.marginTop, 10) : 0  
      let backgroundSize: number = body.style.backgroundSize ? parseInt(body.style.backgroundSize, 10) : 0  
      if (marginTop > 0 && backgroundSize > 100) {  
        $('body').classList.add('touchend')  
        $('.mui-content').classList.add('touchend')  
        $('body').style.backgroundSize = '100% 100%'  
        $('.mui-content').style.marginTop = '0px'  
      }  
      this.dragging = false  
    }  
  }  

  alpha (e: any) {  
    let alpha: number = e.detail.alpha  
    let nav = $('header.mui-bar-nav')  
    if (alpha >= 1) nav.classList.add('show')  
    if (alpha <= 0) nav.classList.remove('show')  
  }  

  mounted () {  
    mui.init()  
    reset()  
    this.maxL = document.documentElement.clientHeight * 0.5  
    for (let i in this.show) this.show[i] = true  
  }  
}  
</script>  

<template lang="pug">  
#app(@touchstart='startDrag', @touchmove='onDrag', @touchend='stopDrag', @alpha='alpha')  
  Icons  
  Numbers  
</template>  

基于 typescript + vue ，现在正在做的项目