From 958ee855acb3431d2da10aa67e2e9453a268fcd4 Mon Sep 17 00:00:00 2001
From: licp <lichunping@guanfang.com.cn>
Date: 星期四, 26 十二月 2024 14:33:11 +0800
Subject: [PATCH] 修改cnasbug
---
src/components/tool/scroll-paging.vue | 69 +++++++++++++++++++++++-----------
1 files changed, 47 insertions(+), 22 deletions(-)
diff --git a/src/components/tool/scroll-paging.vue b/src/components/tool/scroll-paging.vue
index c60265f..a9be127 100644
--- a/src/components/tool/scroll-paging.vue
+++ b/src/components/tool/scroll-paging.vue
@@ -1,15 +1,15 @@
<template>
- <div class="scroll-pagination" ref="content" @scroll="scrollFn">
+ <div class="scroll-pagination" ref="content" @scroll="onScroll">
<slot></slot>
<el-button
- v-if="isLoding"
+ v-if="!finishLoding&&isLoding"
type="text"
style="display: flex; margin: 0 auto; color: #909399"
><i class="el-icon-loading" style="font-size:20px"></i
></el-button>
<el-button
type="text"
- v-if="finishLoding"
+ v-show="finishLoding"
style="display: flex; margin: 0 auto; color: #909399"
>宸茬粡娌℃湁鏇村鍟</el-button
>
@@ -23,6 +23,19 @@
finishLoding: {
type:Boolean,
default:false
+ },
+ list:{
+ type:Array,
+ default:()=>[]
+ }
+ },
+ watch: {
+ list:{
+ deep:true,
+ handler(){
+ this.isLoding = false
+ console.log(this.isLoding)
+ }
}
},
data() {
@@ -30,13 +43,19 @@
isLoding: false,
}
},
+ created(){
+ // 闃叉姈
+ this.onScroll = this.debounce(this.scrollFn,500);
+ // 鑺傛祦
+ // this.onScroll = this.throttle(this.scrollFn,1000);
+ },
mounted(){
- window.addEventListener("scroll", this.throttle(this.scrollFn, 20000));
},
methods: {
+ onScroll(){},
scrollFn() {
let content = this.$refs.content
- if (content.scrollTop + content.clientHeight >= content.scrollHeight) {
+ if (content.scrollTop + content.clientHeight+1 >= content.scrollHeight) {
if(!this.finishLoding){
this.loadMore()
}else{
@@ -47,30 +66,36 @@
loadMore(){
if (this.isLoding) return
this.isLoding = true
- // Simulate loading data (replace with your own API call)
setTimeout(() => {
this.$emit('load')
- this.isLoding = false
- }, 1000)
+ }, 500)
},
- throttle(fn, wait) {
- // 灏佽鍑芥暟杩涜鑺傛祦
- var timer = null;
+ debounce(func, delay) {
+ let timer = null;
return function () {
- var context = this;
- var args = arguments;
- if (!timer) {
- timer = setTimeout(function () {
- fn.apply(context, args);
- timer = null;
- }, wait);
+ if (timer) {
+ clearTimeout(timer);
+ timer = null;
}
+ timer = setTimeout(() => {
+ func(...arguments);
+ }, delay);
};
},
- },
- destroyed() {
- window.removeEventListener("scroll", this.throttle(), false);
- },
+ throttle(func, delay) {
+ let time = null;
+ return function () {
+ let args = Array.from(arguments);
+ if (time === null) {
+ time = setTimeout(() => {
+ func(...args);
+ clearTimeout(time);
+ time = null;
+ }, delay);
+ }
+ };
+ }
+ }
}
</script>
--
Gitblit v1.9.3