C56-GZH-UI/index.html

<template>
  <view class="u-page">
    <u-list @scrolltolower="scrolltolower">
      <u-list-item v-for="(item, index) in indexList" :key="index">
        <u-cell :title="`列表长度-${index + 1}`">
          <u-avatar
            slot="icon"
            shape="square"
            size="35"
            :src="item.url"
            customStyle="margin: -3px 5px -3px 0"
          ></u-avatar>
        </u-cell>
      </u-list-item>
    </u-list>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        indexList: [],
        urls: [
          "https://xxx.com/album/1.jpg",
          "https://xxx.com/album/2.jpg",
          "https://xxx.com/album/3.jpg",
          "https://xxx.com/album/4.jpg",
          "https://xxx.com/album/5.jpg",
          "https://xxx.com/album/6.jpg",
          "https://xxx.com/album/7.jpg",
          "https://xxx.com/album/8.jpg",
          "https://xxx.com/album/9.jpg",
          "https://xxx.com/album/10.jpg",
        ],
      };
    },
    onLoad() {
      this.loadmore();
    },
    methods: {
      scrolltolower() {
        this.loadmore();
      },
      loadmore() {
        for (let i = 0; i < 30; i++) {
          this.indexList.push({
            url: this.urls[uni.$u.random(0, this.urls.length - 1)],
          });
        }
      },
    },
  };
</script>