mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
fix(Tab): incorrect initial swipe position
This commit is contained in:
parent
8296b657a0
commit
f264c46dd8
@ -1,4 +1,4 @@
|
|||||||
import { ref, watch } from 'vue';
|
import { ref, watch, onMounted } from 'vue';
|
||||||
import { createNamespace } from '../utils';
|
import { createNamespace } from '../utils';
|
||||||
import Swipe from '../swipe';
|
import Swipe from '../swipe';
|
||||||
|
|
||||||
@ -7,7 +7,6 @@ const [createComponent, bem] = createNamespace('tabs');
|
|||||||
export default createComponent({
|
export default createComponent({
|
||||||
props: {
|
props: {
|
||||||
inited: Boolean,
|
inited: Boolean,
|
||||||
duration: [Number, String],
|
|
||||||
animated: Boolean,
|
animated: Boolean,
|
||||||
swipeable: Boolean,
|
swipeable: Boolean,
|
||||||
lazyRender: Boolean,
|
lazyRender: Boolean,
|
||||||
@ -15,6 +14,10 @@ export default createComponent({
|
|||||||
type: Number,
|
type: Number,
|
||||||
required: true,
|
required: true,
|
||||||
},
|
},
|
||||||
|
duration: {
|
||||||
|
type: [Number, String],
|
||||||
|
required: true,
|
||||||
|
},
|
||||||
currentIndex: {
|
currentIndex: {
|
||||||
type: Number,
|
type: Number,
|
||||||
required: true,
|
required: true,
|
||||||
@ -39,7 +42,7 @@ export default createComponent({
|
|||||||
ref={swipeRef}
|
ref={swipeRef}
|
||||||
loop={false}
|
loop={false}
|
||||||
class={bem('track')}
|
class={bem('track')}
|
||||||
duration={props.duration}
|
duration={+props.duration * 1000}
|
||||||
touchable={props.swipeable}
|
touchable={props.swipeable}
|
||||||
lazyRender={props.lazyRender}
|
lazyRender={props.lazyRender}
|
||||||
showIndicators={false}
|
showIndicators={false}
|
||||||
@ -53,15 +56,18 @@ export default createComponent({
|
|||||||
return Content;
|
return Content;
|
||||||
};
|
};
|
||||||
|
|
||||||
watch(
|
const swipeToCurrentTab = (index: number) => {
|
||||||
() => props.currentIndex,
|
const swipe = swipeRef.value;
|
||||||
(index) => {
|
if (swipe && swipe.state.active !== index) {
|
||||||
const swipe = swipeRef.value;
|
swipe.swipeTo(index, { immediate: !props.inited });
|
||||||
if (swipe && swipe.state.active !== index) {
|
|
||||||
swipe.swipeTo(index, { immediate: !props.inited });
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
);
|
};
|
||||||
|
|
||||||
|
watch(() => props.currentIndex, swipeToCurrentTab);
|
||||||
|
|
||||||
|
onMounted(() => {
|
||||||
|
swipeToCurrentTab(props.currentIndex);
|
||||||
|
});
|
||||||
|
|
||||||
return () => (
|
return () => (
|
||||||
<div
|
<div
|
||||||
|
Loading…
x
Reference in New Issue
Block a user