Cosmetics

pull/1391/head
mertsincan 2021-07-27 12:16:18 +03:00
parent 6fc67bf2d8
commit a9c215224d
1 changed files with 13 additions and 13 deletions

View File

@ -1,7 +1,7 @@
<template> <template>
<div :ref="elementRef" :class="containerClass" :style="style" @scroll="onScroll"> <div :ref="elementRef" :class="containerClass" :style="style" @scroll="onScroll">
<div :ref="contentRef" class="p-virtualscroller-content"> <div :ref="contentRef" class="p-virtualscroller-content">
<template v-for="(item, index) of renderItems" :key="index"> <template v-for="(item, index) of loadedItems" :key="index">
<slot name="item" :item="item" :options="getOptions(index)"></slot> <slot name="item" :item="item" :options="getOptions(index)"></slot>
</template> </template>
</div> </div>
@ -84,7 +84,7 @@ export default {
} }
}, },
methods: { methods: {
init() { init() {
this.setSize(); this.setSize();
this.calculateOptions(); this.calculateOptions();
this.setSpacerSize(); this.setSpacerSize();
@ -231,7 +231,7 @@ export default {
const scrollLeft = calculateScrollPos(target.scrollLeft, contentPadding.left); const scrollLeft = calculateScrollPos(target.scrollLeft, contentPadding.left);
let newFirst = 0; let newFirst = 0;
let newLast = this.last; let newLast = this.last;
let isRangeChanged = false; let isRangeChanged = false;
if (isBoth) { if (isBoth) {
@ -279,15 +279,15 @@ export default {
if (isRangeChanged) { if (isRangeChanged) {
const newState = { first, last }; const newState = { first, last };
this.setContentPosition(newState); this.setContentPosition(newState);
if (this.lazy) { if (this.lazy) {
this.$emit('lazy-load', { first, last }); this.$emit('lazy-load', { first, last });
} }
this.first = first; this.first = first;
this.last = last; this.last = last;
this.$emit('scroll-index-change', { first, last }); this.$emit('scroll-index-change', { first, last });
} }
}, },
@ -298,7 +298,7 @@ export default {
} }
if (!this.d_loading && this.showLoader) { if (!this.d_loading && this.showLoader) {
const { isRangeChanged: changed } = this.onScrollPositionChange(event); const { isRangeChanged: changed } = this.onScrollPositionChange(event);
if (changed) { if (changed) {
this.d_loading = true; this.d_loading = true;
@ -361,7 +361,7 @@ export default {
if (isBoth) { if (isBoth) {
const newFirst = { rows: calculateFirst(index[0]), cols: calculateFirst(index[1]) }; const newFirst = { rows: calculateFirst(index[0]), cols: calculateFirst(index[1]) };
if (newFirst.rows !== this.first.rows || newFirst.cols !== this.first.cols) if (newFirst.rows !== this.first.rows || newFirst.cols !== this.first.cols)
scrollTo(calculateCoord(newFirst.cols, itemSize[1], contentPadding.left),calculateCoord(newFirst.rows, itemSize[0], contentPadding.top)); scrollTo(calculateCoord(newFirst.cols, itemSize[1], contentPadding.left),calculateCoord(newFirst.rows, itemSize[0], contentPadding.top));
} }
else { else {
@ -375,7 +375,7 @@ export default {
} }
}, },
scrollInView(index, to, behavior = 'auto') { scrollInView(index, to, behavior = 'auto') {
if (to) { if (to) {
const isBoth = this.isBoth(); const isBoth = this.isBoth();
const isHorizontal = this.isHorizontal(); const isHorizontal = this.isHorizontal();
const { first, viewport } = this.getRenderedRange(); const { first, viewport } = this.getRenderedRange();
@ -462,7 +462,7 @@ export default {
}, },
spacerRef(el) { spacerRef(el) {
this.spacer = el; this.spacer = el;
}, }
}, },
computed: { computed: {
containerClass() { containerClass() {
@ -476,7 +476,7 @@ export default {
'p-component-overlay': !this.$slots.loader 'p-component-overlay': !this.$slots.loader
}]; }];
}, },
renderItems() { loadedItems() {
const items = this.items; const items = this.items;
if (items && !this.d_loading) { if (items && !this.d_loading) {
const isBoth = this.isBoth(); const isBoth = this.isBoth();
@ -542,4 +542,4 @@ export default {
align-items: center; align-items: center;
justify-content: center; justify-content: center;
} }
</style> </style>