uniapp监听不到上拉事件怎么解决

<template>
  <view>
    <!-- 此处放置列表数据 -->

  </view>
</template>

<script>
export default {
  data() {
    return {
      // 列表数据
      listData: [],
      // 是否加载中
      isLoading: false,
      // 页面滚动距离
      scrollTop: 0,
      // 页面可见高度
      windowHeight: uni.getSystemInfoSync().windowHeight,
      // 页面总高度
      scrollHeight: 0,
      // 每页数据条数
      pageSize: 10,
      // 当前页数
      pageNum: 1,
      // 总页数
      totalPage: 0
    }
  },
  onLoad() {
    // 初始化数据
    this.getData()
  },
  methods: {
    // 获取数据
    getData() {
      // 加载中不允许重复请求
      if (this.isLoading) {
        return
      }

      // 加载中状态
      this.isLoading = true

      // 请求数据
      api.getData({
        pageNum: this.pageNum,
        pageSize: this.pageSize
      }).then(res => {
        // 数据加载完成后，将isLoading改为false，更新数据
        this.isLoading = false
        this.listData = this.listData.concat(res.list)
        this.totalPage = res.totalPage

        // 更新页面总高度，以便后面判断
        uni.createSelectorQuery().in(this).select('.list-container').boundinGClientRect(data => {
          if (data) {
            this.scrollHeight = data.height
          }
        }).exec()
      })
    },
    // 上拉加载更多
    onScrollToLower() {
      // 判断当前页数是否小于总页数，否则禁止继续加载
      if (this.pageNum >= this.totalPage) {
        return
      }

      // 判断是否满足上拉加载更多的条件
      if (this.scrollTop + this.windowHeight >= this.scrollHeight) {
        // 加载下一页数据
        this.pageNum++
        this.getData()
      }
    },
    // 监听页面滚动事件，更新页面滚动距离
    onPageScroll(obj) {
      this.scrollTop = obj.scrollTop
    }
  }
}
</script>