How to perform an onChange event about react-flickity-component HOT 4 CLOSED

Sorry, it's in the docs. I mean, I can get a ref and then get the index.
https://github.com/theolampert/react-flickity-component#use-flickitys-api-and-events

Doc shows how to do it with class component. For functional, this works:

const Carousel = React.forwardRef(({ children }, externalRef) => {
  return (
    <Flickity
      flickityRef={(carouselRef) => { if (externalRef) externalRef.current = carouselRef }}
    >
      {children}
    </Flickity>
  )
})

Then you call it like:

const carouselRef = useRef(null)
...
<Carousel ref={carouselRef}>
    ...
</Carousel>

from react-flickity-component.

Can I close the issue since you have figured it out?

from react-flickity-component.

Sure. Let's close it.

from react-flickity-component.

Sorry, it's in the docs. I mean, I can get a ref and then get the index.
https://github.com/theolampert/react-flickity-component#use-flickitys-api-and-events

Doc shows how to do it with class component. For functional, this works:

const Carousel = React.forwardRef(({ children }, externalRef) => {
  return (
    <Flickity
      flickityRef={(carouselRef) => { if (externalRef) externalRef.current = carouselRef }}
    >
      {children}
    </Flickity>
  )
})

Then you call it like:

const carouselRef = useRef(null)
...
<Carousel ref={carouselRef}>
    ...
</Carousel>

Sorry I am struggling to put together the final part, I have all that in place and the ref is working, but how do I use it with an onChange listener or similar ?

from react-flickity-component.