fix(Tabs): incorrect scroll position when inited (#11059)

This commit is contained in:
neverland 2022-09-18 22:06:37 +08:00 committed by GitHub
parent 2d47824ae7
commit 41cfae4aa6
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 23 additions and 20 deletions

View File

@ -346,7 +346,7 @@ exports[`should have two "van-coupon-list__empty" classes when render coupon lis
</span>
</div>
<div class="van-tabs__line"
style="transform: translateX(50px) translateX(-50%);"
style="transform: translateX(50px) translateX(-50%); transition-duration: 0.3s;"
>
</div>
</div>

View File

@ -239,7 +239,10 @@ export default defineComponent({
}
};
const setCurrentIndex = (currentIndex: number) => {
const setCurrentIndex = (
currentIndex: number,
skipScrollIntoView?: boolean
) => {
const newIndex = findAvailableTab(currentIndex);
if (!isDef(newIndex)) {
@ -259,16 +262,31 @@ export default defineComponent({
emit('change', newName, newTab.title);
}
}
if (!skipScrollIntoView) {
scrollIntoView();
}
setLine();
// scroll to correct position
if (stickyFixed && !props.scrollspy) {
setRootScrollTop(
Math.ceil(getElementTop(root.value!) - offsetTopPx.value)
);
}
};
// correct the index of active tab
const setCurrentIndexByName = (name: Numeric) => {
const setCurrentIndexByName = (
name: Numeric,
skipScrollIntoView?: boolean
) => {
const matched = children.find(
(tab, index) => getTabName(tab, index) === name
);
const index = matched ? children.indexOf(matched) : 0;
setCurrentIndex(index);
setCurrentIndex(index, skipScrollIntoView);
};
const scrollToCurrentContent = (immediate = false) => {
@ -449,23 +467,8 @@ export default defineComponent({
}
);
watch(
() => state.currentIndex,
() => {
scrollIntoView();
setLine();
// scroll to correct position
if (stickyFixed && !props.scrollspy) {
setRootScrollTop(
Math.ceil(getElementTop(root.value!) - offsetTopPx.value)
);
}
}
);
const init = () => {
setCurrentIndexByName(props.active);
setCurrentIndexByName(props.active, true);
nextTick(() => {
state.inited = true;
if (wrapRef.value) {