element ui下拉刷新

以下是Element UI下拉刷新的实现方法：

1. 在需要添加下拉刷新的组件上添加 ref 属性，例如：

<el-table ref="table"></el-table>

2. 在 mounted 钩子函数中获取该组件的 DOM 元素，并为其添加滚动事件监听器，例如：

mounted() {
  const tableDom = this.$refs.table.$el.querySelector('.el-table__body-wrapper')
  tableDom.addEventListener('scroll', this.handleScroll)
},
methods: {
  handleScroll() {
    const tableDom = this.$refs.table.$el.querySelector('.el-table__body-wrapper')
    if (tableDom.scrollTop === 0) {
      // 触发下拉刷新操作
    }
  }
}

3. 在 handleScroll 方法中判断是否触发下拉刷新操作，例如：

handleScroll() {
  const tableDom = this.$refs.table.$el.querySelector('.el-table__body-wrapper')
  if (tableDom.scrollTop === 0) {
    const isRefreshing = this.$data.isRefreshing
    if (!isRefreshing) {
      this.$data.isRefreshing = true
      // 执行下拉刷新操作
      // 刷新完成后将 isRefreshing 置为 false
    }
  }
}

4. 在下拉刷新操作完成后，将 isRefreshing 置为 false，例如：

this.$data.isRefreshing = false