我如何以编程方式将轮播移动到react-native-reanimated-carousel中的下一个项目?

问题描述 投票:0回答:1

我在按按钮时以编程方式将轮播项目移动到下一个或上一个项目时遇到问题。

我知道我必须设置钩子 useCarouselController,但我找不到任何地方可以导入它。它既不在他们的网站上,也不在仓库上。我用谷歌搜索了一下,但似乎找不到任何有关此的信息。我知道这是可以做到的,所以如果你做了这样的事情,我会很感激。

请帮忙解决这个问题,非常感谢

import { Carousel } from 'react-native-reanimated-carousel';

// Assuming you have a carouselController from useCarouselController
const { next } = carouselController;

// Your Carousel component
<Carousel
  defaultIndex={2}
  carouselController={carouselController}
  // other props
/>

// Your button
<Button title="Next" onPress={next} />
react-native expo carousel hybrid-mobile-app
1个回答
0
投票
import type { ICarouselInstance } from "react-native-reanimated-carousel";

const YourComponent = () => {
const ref = React.useRef<ICarouselInstance>(null);

    return (
        <View>
            <Carousel
            ref={ref}
            defaultIndex={2}
            // other props
            />
            <Button title="Next" onPress={() => {
                ref.current.next()
            }} />
        </View>
    )

}

https://reanimated-carousel.dev/props#next

滚动到下一项,它需要一个可选参数(计数),它允许您指定要交叉的项目数

© www.soinside.com 2019 - 2024. All rights reserved.