blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-06 03:57:59 +08:00
Code Issues Projects Releases Wiki Activity

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

Browse Source
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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
packages/vant/src/coupon-list/test/__snapshots__/index.spec.ts.snap
View File

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

41
packages/vant/src/tabs/Tabs.tsx
View File

@ -239,7 +239,10 @@ export default defineComponent({
} }
}; };
const setCurrentIndex = (currentIndex: number) => { const setCurrentIndex = (
currentIndex: number,
skipScrollIntoView?: boolean
) => {
const newIndex = findAvailableTab(currentIndex); const newIndex = findAvailableTab(currentIndex);
if (!isDef(newIndex)) { if (!isDef(newIndex)) {
@ -259,16 +262,31 @@ export default defineComponent({
emit('change', newName, newTab.title); 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 // correct the index of active tab
const setCurrentIndexByName = (name: Numeric) => { const setCurrentIndexByName = (
name: Numeric,
skipScrollIntoView?: boolean
) => {
const matched = children.find( const matched = children.find(
(tab, index) => getTabName(tab, index) === name (tab, index) => getTabName(tab, index) === name
); );
const index = matched ? children.indexOf(matched) : 0; const index = matched ? children.indexOf(matched) : 0;
setCurrentIndex(index); setCurrentIndex(index, skipScrollIntoView);
}; };
const scrollToCurrentContent = (immediate = false) => { 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 = () => { const init = () => {
setCurrentIndexByName(props.active); setCurrentIndexByName(props.active, true);
nextTick(() => { nextTick(() => {
state.inited = true; state.inited = true;
if (wrapRef.value) { if (wrapRef.value) {