diff --git a/src/swipe-item/index.js b/src/swipe-item/index.js
index 13d1f67a8..780ead33d 100644
--- a/src/swipe-item/index.js
+++ b/src/swipe-item/index.js
@@ -1,7 +1,8 @@
import { computed, nextTick, onMounted, reactive } from 'vue';
import { SWIPE_KEY } from '../swipe';
import { createNamespace } from '../utils';
-import { useParent } from '../composition/use-parent';
+import { useExpose } from '../composition/use-expose';
+import { useParent } from '../composition/use-relation';
const [createComponent, bem] = createNamespace('swipe-item');
@@ -12,17 +13,7 @@ export default createComponent({
mounted: false,
});
- const setOffset = (offset) => {
- state.offset = offset;
- };
-
- const { parent, index } = useParent(SWIPE_KEY, { setOffset });
-
- onMounted(() => {
- nextTick(() => {
- state.mounted = true;
- });
- });
+ const { parent, index } = useParent(SWIPE_KEY);
const style = computed(() => {
const style = {};
@@ -55,6 +46,18 @@ export default createComponent({
return index.value >= prevActive || index.value <= nextActive;
});
+ const setOffset = (offset) => {
+ state.offset = offset;
+ };
+
+ onMounted(() => {
+ nextTick(() => {
+ state.mounted = true;
+ });
+ });
+
+ useExpose({ setOffset });
+
return () => (
{shouldRender.value ? slots.default?.() : null}
diff --git a/src/swipe/index.js b/src/swipe/index.js
index c29dd9c5a..52a9200cf 100644
--- a/src/swipe/index.js
+++ b/src/swipe/index.js
@@ -1,7 +1,6 @@
import {
ref,
watch,
- provide,
reactive,
computed,
onMounted,
@@ -18,10 +17,11 @@ import { doubleRaf } from '../utils/dom/raf';
import { preventDefault } from '../utils/dom/event';
// Composition
-import { useTouch } from '../composition/use-touch';
-import { useRect } from '../composition/use-rect';
-import { useExpose } from '../composition/use-expose';
import { usePageVisibility, useWindowSize } from '@vant/use';
+import { useRect } from '../composition/use-rect';
+import { useTouch } from '../composition/use-touch';
+import { useExpose } from '../composition/use-expose';
+import { useChildren } from '../composition/use-relation';
const [createComponent, bem] = createNamespace('swipe');
@@ -73,10 +73,10 @@ export default createComponent({
active: 0,
swiping: false,
});
- const children = reactive([]);
const touch = useTouch();
const windowSize = useWindowSize();
+ const { children, linkChildren } = useChildren(SWIPE_KEY);
const count = computed(() => children.length);
@@ -370,9 +370,9 @@ export default createComponent({
swipeTo,
});
- provide(SWIPE_KEY, { size, props, count, children, activeIndicator });
+ linkChildren({ size, props, count, activeIndicator });
- watch([children, () => props.initialSwipe], initialize);
+ watch([() => children.length, () => props.initialSwipe], initialize);
watch(
() => props.autoplay,