Hi @archriss,
I have a snap-carousel component with pagination (GREAT repo by the way!👍🏽 ). And everything works except I get this annoying error that the Pagination carouselRef isn't set when tappableDots
is true
, when it actually is set..... and it works. So the warning error is the only issue.
Hi @wkwyatt,
That's because the carousel reference isn't available before the component has been fully initialized, and Pagination
's init is usually much quicker than Carousel
's one.
If you take a look at the example's source code, you'll see that I've used a simple trick to prevent this error:
get example1 () {
const { slider1Ref } = this.state;
return (
<View>
<Carousel
ref={(c) => { if (!this.state.slider1Ref) { this.setState({ slider1Ref: c }); } }}
/>
<Pagination
carouselRef={slider1Ref}
tappableDots={!!slider1Ref}
/>
</View>
);
Does this solves the issue for you?
Thanks it does, as I wrote the post I came up with this solution but was unsure if there was a better way.
<Pagination
carouselRef={slider1Ref || {} }
tappableDots
/>
But thank you for responding so quickly :)
You're welcome ;-) I would also like to find a better solution, but that's the best I was able to come up with for now...
By the way, tappableDots
expects a boolean, which means you should write tappableDots={sliderRef || false}
.
Yea you are right! Just fixed it lol...thats what I get for responding as soon as I woke up.
Most helpful comment
You're welcome ;-) I would also like to find a better solution, but that's the best I was able to come up with for now...
By the way,
tappableDots
expects a boolean, which means you should writetappableDots={sliderRef || false}
.