59 lines
1.3 KiB
Vue
59 lines
1.3 KiB
Vue
<template>
|
|
<view class="u-page">
|
|
<up-list
|
|
@scrolltolower="scrolltolower"
|
|
>
|
|
<up-list-item
|
|
v-for="(item, index) in indexList"
|
|
:key="index"
|
|
>
|
|
<up-cell
|
|
:title="`列表长度-${index + 1}`"
|
|
>
|
|
<template #icon>
|
|
<up-avatar
|
|
shape="square"
|
|
size="35"
|
|
:src="item.url"
|
|
customStyle="margin: -3px 5px -3px 0"
|
|
></up-avatar>
|
|
</template>
|
|
</up-cell>
|
|
</up-list-item>
|
|
</up-list>
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { ref, reactive } from 'vue';
|
|
import { onLoad, onShow } from '@dcloudio/uni-app';
|
|
const indexList = ref([]);
|
|
const urls = [
|
|
'https://uview-plus.jiangruyi.com/album/1.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/2.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/3.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/4.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/5.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/6.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/7.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/8.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/9.jpg',
|
|
'https://uview-plus.jiangruyi.com/album/10.jpg',
|
|
];
|
|
|
|
onLoad(() => {
|
|
loadmore();
|
|
});
|
|
|
|
const scrolltolower = () => {
|
|
loadmore();
|
|
};
|
|
|
|
const loadmore = () => {
|
|
for (let i = 0; i < 30; i++) {
|
|
indexList.value.push({
|
|
url: urls[uni.$u.random(0, urls.length - 1)],
|
|
});
|
|
}
|
|
};
|
|
</script> |