Refactor VirtualScroll demo

pull/1533/head
mertsincan 2021-08-31 10:33:45 +03:00
parent 35438385b3
commit bc19f7f587
1 changed files with 22 additions and 28 deletions

View File

@ -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);