vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Fixed #2755 - The scrollToIndex method doesn't work as expected

pull/2760/head
mertsincan 2022-07-04 10:22:14 +01:00
parent 47a3df5e2f
commit cd8b59bd16
1 changed files with 13 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/virtualscroller/VirtualScroller.vue
View File

@ -143,7 +143,6 @@ export default {
return this.orientation === 'both'; return this.orientation === 'both';
}, },
scrollTo(options) { scrollTo(options) {
this.lastScrollPos = this.isBoth() ? { top: 0, left: 0 } : 0;
this.element && this.element.scrollTo(options); this.element && this.element.scrollTo(options);
}, },
scrollToIndex(index, behavior = 'auto') { scrollToIndex(index, behavior = 'auto') {
@ -152,22 +151,20 @@ export default {
const first = this.first; const first = this.first;
const { numToleratedItems } = this.calculateNumItems(); const { numToleratedItems } = this.calculateNumItems();
const itemSize = this.itemSize; const itemSize = this.itemSize;
const contentPos = this.getContentPosition();
const calculateFirst = (_index = 0, _numT) => (_index <= _numT ? 0 : _index); const calculateFirst = (_index = 0, _numT) => (_index <= _numT ? 0 : _index);
const calculateCoord = (_first, _size, _cpos) => (_first * _size) + _cpos; const calculateCoord = (_first, _size) => (_first * _size);
const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior }); const scrollTo = (left = 0, top = 0) => this.scrollTo({ left, top, behavior });
if (both) { if (both) {
const newFirst = { rows: calculateFirst(index[0], numToleratedItems[0]), cols: calculateFirst(index[1], numToleratedItems[1]) }; const newFirst = { rows: calculateFirst(index[0], numToleratedItems[0]), cols: calculateFirst(index[1], numToleratedItems[1]) };
if (newFirst.rows !== first.rows || newFirst.cols !== first.cols) { if (newFirst.rows !== first.rows || newFirst.cols !== first.cols) {
scrollTo(calculateCoord(newFirst.cols, itemSize[1], contentPos.left), calculateCoord(newFirst.rows, itemSize[0], contentPos.top)) scrollTo(calculateCoord(newFirst.cols, itemSize[1]), calculateCoord(newFirst.rows, itemSize[0]))
} }
} }
else { else {
const newFirst = calculateFirst(index, numToleratedItems); const newFirst = calculateFirst(index, numToleratedItems);
if (newFirst !== first) { if (newFirst !== first) {
horizontal ? scrollTo(calculateCoord(newFirst, itemSize, contentPos.left), 0) : scrollTo(0, calculateCoord(newFirst, itemSize, contentPos.top)); horizontal ? scrollTo(calculateCoord(newFirst, itemSize), 0) : scrollTo(0, calculateCoord(newFirst, itemSize));
} }
} }
}, },
@ -398,9 +395,10 @@ export default {
const scrollTop = calculateScrollPos(target.scrollTop, contentPos.top); const scrollTop = calculateScrollPos(target.scrollTop, contentPos.top);
const scrollLeft = calculateScrollPos(target.scrollLeft, contentPos.left); const scrollLeft = calculateScrollPos(target.scrollLeft, contentPos.left);
let newFirst = 0; let newFirst = both ? { rows: 0, cols: 0 } : 0;
let newLast = this.last; let newLast = this.last;
let isRangeChanged = false; let isRangeChanged = false;
let newScrollPos = this.lastScrollPos;
if (both) { if (both) {
const isScrollDown = this.lastScrollPos.top <= scrollTop; const isScrollDown = this.lastScrollPos.top <= scrollTop;
@ -420,9 +418,8 @@ export default {
cols: calculateLast(currentIndex.cols, newFirst.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], true) cols: calculateLast(currentIndex.cols, newFirst.cols, this.last.cols, this.numItemsInViewport.cols, this.d_numToleratedItems[1], true)
}; };
isRangeChanged = (newFirst.rows !== this.first.rows && newLast.rows !== this.last.rows) || (newFirst.cols !== this.first.cols && newLast.cols !== this.last.cols); isRangeChanged = (newFirst.rows !== this.first.rows || newLast.rows !== this.last.rows) || (newFirst.cols !== this.first.cols || newLast.cols !== this.last.cols);
newScrollPos = { top: scrollTop, left: scrollLeft };
this.lastScrollPos = { top: scrollTop, left: scrollLeft };
} }
else { else {
const scrollPos = horizontal ? scrollLeft : scrollTop; const scrollPos = horizontal ? scrollLeft : scrollTop;
@ -432,19 +429,19 @@ export default {
newFirst = calculateFirst(currentIndex, triggerIndex, this.first, this.last, this.numItemsInViewport, this.d_numToleratedItems, isScrollDownOrRight); newFirst = calculateFirst(currentIndex, triggerIndex, this.first, this.last, this.numItemsInViewport, this.d_numToleratedItems, isScrollDownOrRight);
newLast = calculateLast(currentIndex, newFirst, this.last, this.numItemsInViewport, this.d_numToleratedItems); newLast = calculateLast(currentIndex, newFirst, this.last, this.numItemsInViewport, this.d_numToleratedItems);
isRangeChanged = newFirst !== this.first && newLast !== this.last; isRangeChanged = newFirst !== this.first || newLast !== this.last;
newScrollPos = scrollPos;
this.lastScrollPos = scrollPos;
} }
return { return {
first: newFirst, first: newFirst,
last: newLast, last: newLast,
isRangeChanged isRangeChanged,
scrollPos: newScrollPos
} }
}, },
onScrollChange(event) { onScrollChange(event) {
const { first, last, isRangeChanged } = this.onScrollPositionChange(event); const { first, last, isRangeChanged, scrollPos } = this.onScrollPositionChange(event);
if (isRangeChanged) { if (isRangeChanged) {
const newState = { first, last }; const newState = { first, last };
@ -453,6 +450,7 @@ export default {
this.first = first; this.first = first;
this.last = last; this.last = last;
this.lastScrollPos = scrollPos;
this.$emit('scroll-index-change', newState); this.$emit('scroll-index-change', newState);