下拉逻辑修改

feasure-livedata
lld 2026-03-29 20:44:51 +08:00
parent 57f70d1010
commit f49fc45272
1 changed files with 57 additions and 4 deletions

View File

@ -6,14 +6,16 @@
:scroll-y="true"
class="message-list"
:refresher-enabled="true"
:scroll-anchoring="true"
refresher-background="#f5f5f5"
:refresher-triggered="refreshing"
:scroll-into-view="scrollId"
:scroll-with-animation="false"
@refresherrefresh="onRefresh"
>
<view
v-for="(item, index) in messageList"
:key="index"
:id="`item${item.id}`"
@click="gotoDevice(item)"
class="message-item"
>
@ -33,7 +35,7 @@
<view class="champion-card">
<view class="sender-info">
<image class="avatar" :src="item.avatar" mode="aspectFill"></image>
<text class="sender-text">{{ item.showTips }}</text>
<text class="sender-text">{{ "item "+index+" " +item.id }}</text>
</view>
</view>
</view>
@ -47,12 +49,15 @@
</template>
<script>
import Uuid from "@/tuniao-ui/libs/function/uuid";
export default {
data() {
return {
refreshing: false, //
refreshing: false, //
messageList: [
{
id: 'msg1',
time: '2026-03-26 22:19:00',
type: 'champion',
avatar: 'https://picsum.photos/id/237/60/60',
@ -60,34 +65,75 @@ export default {
showTips: '03月26日排行榜冠军恭喜你'
},
{
id: 'msg2',
time: '2026-03-25 22:19:00',
showTips: '03月25日排行榜冠军恭喜你'
},
{
id: 'msg3',
time: '2026-03-16 22:19:00',
showTips: '03月25日排行榜冠军恭喜你'
},
{
id: 'msg4',
time: '2026-03-26 05:36:00',
type: 'like',
avatar: 'https://picsum.photos/id/1005/60/60',
sender: 'JFather'
},
{
id: 'msg5',
time: '2026-03-24 22:19:00',
type: 'step',
rank: 160,
steps: 1838
},
{
id: 'msg6',
time: '2026-03-27 05:36:00',
type: 'champion',
avatar: 'https://picsum.photos/id/1012/60/60',
sender: 'T薛策恒',
date: '03月24'
},
{
id: 'msg7',
time: '2026-03-28 05:36:00',
type: 'like',
avatar: 'https://picsum.photos/id/1013/60/60',
sender: 'User7'
},
{
id: 'msg8',
time: '2026-03-29 05:36:00',
type: 'champion',
avatar: 'https://picsum.photos/id/1014/60/60',
sender: 'User8'
},
{
id: 'msg9',
time: '2026-03-30 05:36:00',
type: 'step',
rank: 200,
steps: 2000
},
{
id: 'msg10',
time: '2026-03-31 05:36:00',
type: 'like',
avatar: 'https://picsum.photos/id/1015/60/60',
sender: 'User10'
},
{
id: 'msg11',
time: '2026-04-01 05:36:00',
type: 'champion',
avatar: 'https://picsum.photos/id/1016/60/60',
sender: 'User11'
}
],
isHaveOldData: true
isHaveOldData: true,
scrollId: null
}
},
onShow() {
@ -146,6 +192,7 @@ export default {
setTimeout(() => {
// 10
const newData = Array.from({ length: 10 }, (_, i) => ({
id: Uuid(16),
time: '2026-03-27 12:00:00',
type: 'champion',
avatar: 'https://picsum.photos/id/999/60/60',
@ -154,6 +201,12 @@ export default {
}));
//
this.messageList = [...newData, ...this.messageList];
// scrollId
this.$nextTick(() => {
this.scrollId = "item"+this.messageList[10].id;
});
//
this.refreshing = false;
}, 800);