Refactor VirtualScroll demo
parent
35438385b3
commit
bc19f7f587
|
@ -721,15 +721,9 @@ import { ref, onMounted } from 'vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
setup() {
|
setup() {
|
||||||
onMounted(() => {
|
const basicItems = ref(Array.from({ length: 100000 }).map((_, i) => \`Item #\${i}\`));
|
||||||
basicItems.value = Array.from({ length: 100000 }).map((_, i) => \`Item #\${i}\`);
|
const multiItems = ref(Array.from({ length: 1000 }).map((_, i) => Array.from({ length: 1000 }).map((_j, j) => \`Item #\${i}_\${j}\`)));
|
||||||
multiItems.value = Array.from({ length: 1000 }).map((_, i) => Array.from({ length: 1000 }).map((_j, j) => \`Item #\${i}_\${j}\`));
|
const lazyItems = ref(Array.from({ length: 10000 }));
|
||||||
lazyItems.value = Array.from({ length: 10000 });
|
|
||||||
})
|
|
||||||
|
|
||||||
const basicItems = ref(null);
|
|
||||||
const multiItems = ref(null);
|
|
||||||
const lazyItems = ref(null);
|
|
||||||
const lazyLoading = ref(false);
|
const lazyLoading = ref(false);
|
||||||
const loadLazyTimeout = ref(null);
|
const loadLazyTimeout = ref(null);
|
||||||
|
|
||||||
|
@ -743,13 +737,13 @@ export default {
|
||||||
//imitate delay of a backend call
|
//imitate delay of a backend call
|
||||||
loadLazyTimeout.value = setTimeout(() => {
|
loadLazyTimeout.value = setTimeout(() => {
|
||||||
const { first, last } = event;
|
const { first, last } = event;
|
||||||
const lazyItems = [...lazyItems.value];
|
const _lazyItems = [...lazyItems.value];
|
||||||
|
|
||||||
for (let i = first; i < last; i++) {
|
for (let i = first; i < last; i++) {
|
||||||
lazyItems[i] = \`Item #\${i}\`;
|
_lazyItems[i] = \`Item #\${i}\`;
|
||||||
}
|
}
|
||||||
|
|
||||||
lazyItems.value = lazyItems;
|
lazyItems.value = _lazyItems;
|
||||||
lazyLoading.value = false;
|
lazyLoading.value = false;
|
||||||
|
|
||||||
}, Math.random() * 1000 + 250);
|
}, Math.random() * 1000 + 250);
|
||||||
|
|
Loading…
Reference in New Issue