DEV Community

Discussion on: Customizing Swiper.js prev/next arrow buttons and pagination bullets in React

View post
Collapse
 
drprime01 profile image
DrPrime01 •

Hello, nice article
However, I'm getting swiperContainer.initialize is not a function. How did you manage to escape that?

Collapse
 
ivadyhabimana profile image
Ivad Yves HABIMANA •

I'm not sure but I think that following the mentioned in the article steps 100% should get everything to work. If it's not working for you, can you try to log the swiperContainer and see what object do you have in your case

Collapse
 
artemshchirov profile image
Artem Shchirov • • Edited

Hi! Thanks for the article. However, I am also stuck with this error in my Next.js TypeScript project: "swiperContainer.initialize is not a function."

When I use console.log(swiperContainer), it returns an HTML element.

<div class="swiper-slide" role="group" aria-label="3 / 3" style="width: 1160px; opacity: 0; transform: translate3d(-2320px, 0px, 0px);">
<img alt="Slide" loading="lazy" width="2731" height="4096" decoding="async" data-nimg="1" style="color:transparent" srcset="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimg_4.e3bfeac7.jpg&amp;w=3840&amp;q=75 1x" src="/_next/image?url=%2F_next%2Fstatic%2Fmedia%2Fimg_4.e3bfeac7.jpg&amp;w=3840&amp;q=75">
</div>
Enter fullscreen mode Exit fullscreen mode
Thread Thread
 
ivadyhabimana profile image
Ivad Yves HABIMANA •

I just confirmed and everything still works even using next js I have recreated it in this code sandbox here codesandbox.io/p/sandbox/intellige...

Can you confirm that you are following all the steps?

Thread Thread
 
ivadyhabimana profile image
Ivad Yves HABIMANA •

@artemshchirov @drprime01