blackteay/vant
1
0
Fork 0
mirror of https://gitee.com/vant-contrib/vant.git synced 2025-04-05 19:41:42 +08:00
Code Issues Projects Releases Wiki Activity

fix(IndexBar): allow active bottom anchor (#10404)

Browse Source 
* fix(IndexBar): allow active bottom anchor

* fix(IndexBar): prettier
This commit is contained in:
nemo-shen 2022-03-18 08:30:22 +08:00 committed by GitHub
parent 5f67b9ee42
commit 7c00cea862
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 28 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

32
packages/vant/src/index-bar/IndexBar.tsx
View File

@ -81,6 +81,7 @@ export default defineComponent({
const touch = useTouch();
const scrollParent = useScrollParent(root);
const { children, linkChildren } = useChildren(INDEX_BAR_KEY);
let selectActiveIndex: string;
linkChildren({ props });
@ -116,6 +117,9 @@ export default defineComponent({
return -1;
};
const getMatchAnchor = (index: string) =>
children.find((item) => String(item.index) === index);
const onScroll = () => {
if (isHidden(root)) {
return;
@ -129,7 +133,16 @@ export default defineComponent({
item.getRect(scrollParent.value, scrollParentRect)
);
const active = getActiveAnchor(scrollTop, rects);
let active = -1;
if (selectActiveIndex) {
const match = getMatchAnchor(selectActiveIndex);
if (match) {
const rect = match.getRect(scrollParent.value, scrollParentRect);
active = getActiveAnchor(rect.top, rects);
}
} else {
active = getActiveAnchor(scrollTop, rects);
}
activeAnchor.value = indexList[active];
@ -150,7 +163,7 @@ export default defineComponent({
state.top =
Math.max(props.stickyOffsetTop, rects[index].top - scrollTop) +
scrollParentRect.top;
} else if (index === active - 1) {
} else if (index === active - 1 && selectActiveIndex === '') {
const activeItemTop = rects[active].top - scrollTop;
state.active = activeItemTop > 0;
state.top =
@ -160,6 +173,8 @@ export default defineComponent({
}
});
}
selectActiveIndex = '';
};
const init = () => {
@ -193,10 +208,19 @@ export default defineComponent({
});
const scrollTo = (index: string | number) => {
index = String(index);
const match = children.find((item) => String(item.index) === index);
selectActiveIndex = String(index);
const match = getMatchAnchor(selectActiveIndex);
if (match) {
const scrollTop = getScrollTop(scrollParent.value!);
const scrollParentRect = useRect(scrollParent);
const { offsetHeight } = document.documentElement;
if (scrollTop === offsetHeight - scrollParentRect.height) {
onScroll();
return;
}
match.$el.scrollIntoView();
if (props.sticky && props.stickyOffsetTop) {