uniapp微信小程序无限滚动

实现无限滚动可以通过监听scroll-view组件的scrolltolower事件，在滚动到底部时加载更多数据。以下是一个简单的示例代码：

<template>
  <scroll-view scroll-y="true" style="height: 100vh;" @scrolltolower="loadMore">
    <view v-for="(item, index) in list" :key="index">{{ item }}</view>
  </scroll-view>
</template>

<script>
export default {
  data() {
    return {
      list: [], // 列表数据
      pageNo: 1, // 当前页码
      pageSize: 10, // 每页数据量
      isEnd: false // 数据是否已经加载完毕
    };
  },
  mounted() {
    this.loadData();
  },
  methods: {
    // 加载数据
    loadData() {
      if (this.isEnd) return;
      // 模拟异步加载数据
      setTimeout(() => {
        const data = Array.from({ length: this.pageSize }, (_, i) => `item ${i}`);
        this.list = this.list.concat(data);
        this.pageNo++;
        if (this.pageNo > 5) {
          this.isEnd = true;
        }
      }, 1000);
    },
    // 加载更多
    loadMore() {
      this.loadData();
    }
  }
};
</script>

在示例代码中，我们使用了一个名为list的数组来存储列表数据，然后通过loadData方法模拟异步加载数据的过程，每次加载完数据后会将数据追加到list数组中。在scroll-view组件上监听scrolltolower事件，当滚动到底部时触发loadMore方法来加载更多数据。同时，我们使用了一个isEnd标志位来表示数据是否已经加载完毕，当所有数据都已经加载完毕时，可以停止监听scrolltolower事件，避免不必要的网络请求。