You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
63 lines
1.2 KiB
63 lines
1.2 KiB
<template>
|
|
<view class="container">
|
|
<scroll-view
|
|
class="scroll-view"
|
|
scroll-y="true"
|
|
@scrolltolower="onScrollToLower"
|
|
>
|
|
<button @click="scrollTo">点击滚动</button>
|
|
<view v-for="(item, index) in list" :key="index">
|
|
{{ item }}
|
|
</view>
|
|
</scroll-view>
|
|
<button @click="addItem">添加内容</button>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
list: Array.from({ length: 20 }, (_, i) => `Item ${i + 1}`),
|
|
};
|
|
},
|
|
methods: {
|
|
onScrollToLower() {
|
|
console.log("滚动到底部了");
|
|
// 可以在这里加载更多数据
|
|
},
|
|
addItem() {
|
|
this.list.push(`Item ${this.list.length + 1}`);
|
|
this.$nextTick(() => {
|
|
this.$refs.scrollView.scrollTo({
|
|
top: 99999,
|
|
duration: 300,
|
|
});
|
|
});
|
|
},
|
|
scrollTo() {
|
|
uni.pageScrollTo({
|
|
scrollTop: 100,
|
|
duration: 300,
|
|
});
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
<style>
|
|
.container {
|
|
height: 100%;
|
|
}
|
|
.scroll-view {
|
|
height: 80%;
|
|
}
|
|
button {
|
|
width: 100%;
|
|
height: 50px;
|
|
line-height: 50px;
|
|
text-align: center;
|
|
background-color: #007aff;
|
|
color: white;
|
|
}
|
|
</style>
|