From af38ffda1d4dac5123e31eae088cf831c3e441e6 Mon Sep 17 00:00:00 2001 From: novlan1 <1576271227@qq.com> Date: Sat, 30 Nov 2024 00:14:55 +0800 Subject: [PATCH 1/2] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Dcurrent=E5=8F=97?= =?UTF-8?q?=E6=8E=A7=E6=97=B6=E8=A1=A8=E7=8E=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/swiper/demos/current.vue | 8 +++++++- src/swiper/swiper.tsx | 21 ++++++++++++++------- 2 files changed, 21 insertions(+), 8 deletions(-) diff --git a/src/swiper/demos/current.vue b/src/swiper/demos/current.vue index 7cbeb07df..7d19c87bb 100644 --- a/src/swiper/demos/current.vue +++ b/src/swiper/demos/current.vue @@ -12,7 +12,7 @@
- + 跳转到第 {{ current + 2 >= 6 ? 1 : current + 2 }} 项
@@ -33,10 +33,16 @@ const current = ref(0); const handleChange = (index: number, context: any) => { console.log('基础示例,页数变化到》》》', index, context); + current.value = index; }; const handleClick = (value: number) => { console.log('click: ', value); + current.value = value; +}; + +const changeCurrent = () => { + current.value = current.value + 2 > 5 ? 0 : current.value + 1; }; diff --git a/src/swiper/swiper.tsx b/src/swiper/swiper.tsx index dd1d89af9..cce6481c6 100644 --- a/src/swiper/swiper.tsx +++ b/src/swiper/swiper.tsx @@ -28,8 +28,9 @@ export default defineComponent({ const root = ref(); const items = ref([]); const { current: value, modelValue } = toRefs(props); - const [currentIndex, setCurrent] = useVModel(value, modelValue, props.defaultCurrent); + const [currentIndex, setCurrent] = useVModel(value, modelValue, props.defaultCurrent, props.onChange, 'current'); const swiperContainer = ref(null); + const previous = ref(currentIndex.value ?? 0); const animating = ref(false); const disabled = ref(false); @@ -77,9 +78,10 @@ export default defineComponent({ props.onClick?.(currentIndex.value ?? 0); }; - const move = (step: number, source: SwiperChangeSource, isReset = false) => { + const move = (step: number, source: SwiperChangeSource, isReset = false, targetValue?: number) => { animating.value = true; - processIndex(isReset ? step : (currentIndex.value as number) + step, source); + const innerTargetValue = targetValue ?? (isReset ? step : currentIndex.value + step); + processIndex(innerTargetValue, source); const moveDirection = !isVertical.value ? 'X' : 'Y'; const distance = root.value?.[isVertical.value ? 'offsetHeight' : 'offsetWidth'] ?? 0; @@ -117,6 +119,11 @@ export default defineComponent({ move(1, source); }; + const innerSetCurrent = (val: number) => { + setCurrent(val); + previous.value = val; + }; + const processIndex = (index: number, source: SwiperChangeSource) => { const max = items.value.length; let val = index; @@ -127,7 +134,7 @@ export default defineComponent({ if (index >= max) { val = props.loop ? 0 : max - 1; } - setCurrent(val); + innerSetCurrent(val); context.emit('update:current', val); context.emit('change', val, { source }); }; @@ -219,11 +226,11 @@ export default defineComponent({ watch(currentIndex, updateContainerHeight); watch( () => props.current, - () => { + (val, oldVal) => { // v-model动态更新时不触发move逻辑 - if (props.current === currentIndex.value) return; + if (val === previous.value) return; stopAutoplay(); - move(props.current - currentIndex.value, 'autoplay'); + move(val - oldVal, 'autoplay', false, val); startAutoplay(); }, ); From bcc0c5553e79c187a9638db535287fae1cf7a462 Mon Sep 17 00:00:00 2001 From: novlan1 <1576271227@qq.com> Date: Sat, 30 Nov 2024 00:26:05 +0800 Subject: [PATCH 2/2] =?UTF-8?q?feat(swiper):=20=E4=BC=98=E5=8C=96swiper?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/swiper/swiper.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/swiper/swiper.tsx b/src/swiper/swiper.tsx index cce6481c6..b6046bd2f 100644 --- a/src/swiper/swiper.tsx +++ b/src/swiper/swiper.tsx @@ -28,7 +28,7 @@ export default defineComponent({ const root = ref(); const items = ref([]); const { current: value, modelValue } = toRefs(props); - const [currentIndex, setCurrent] = useVModel(value, modelValue, props.defaultCurrent, props.onChange, 'current'); + const [currentIndex, setCurrent] = useVModel(value, modelValue, props.defaultCurrent); const swiperContainer = ref(null); const previous = ref(currentIndex.value ?? 0);