diff --git a/src/Carousel.tsx b/src/Carousel.tsx index 42611974..7791b010 100644 --- a/src/Carousel.tsx +++ b/src/Carousel.tsx @@ -46,9 +46,10 @@ const Carousel = React.forwardRef>( const commonVariables = useCommonVariables(props); const { size, handlerOffsetX } = commonVariables; + const dataLength = data.length; const offsetX = useDerivedValue(() => { - const totalSize = size * data.length; + const totalSize = size * dataLength; const x = handlerOffsetX.value % totalSize; if (!loop) { diff --git a/src/hooks/useOnProgressChange.ts b/src/hooks/useOnProgressChange.ts index 6a61469c..aa5f02a8 100644 --- a/src/hooks/useOnProgressChange.ts +++ b/src/hooks/useOnProgressChange.ts @@ -13,23 +13,24 @@ export function useOnProgressChange( } & Pick ) { const { offsetX, rawData, size, onProgressChange } = opts; + const rawDataLength = rawData.length; useAnimatedReaction( () => offsetX.value, (_value) => { let value = _value; - if (rawData.length === DATA_LENGTH.SINGLE_ITEM) { + if (rawDataLength === DATA_LENGTH.SINGLE_ITEM) { value = value % size; } - if (rawData.length === DATA_LENGTH.DOUBLE_ITEM) { + if (rawDataLength === DATA_LENGTH.DOUBLE_ITEM) { value = value % (size * 2); } let absoluteProgress = Math.abs(value / size); if (value > 0) { - absoluteProgress = rawData.length - absoluteProgress; + absoluteProgress = rawDataLength - absoluteProgress; } !!onProgressChange &&