0

I got this Swiper error while I was testing Swiper. Can someone help me fix it?

import { Swiper, SwiperSlide } from "swiper/react";
import { Autoplay, Pagination, Navigation } from "swiper/modules";
import "swiper/css";
import "swiper/css/pagination";
import "swiper/css/navigation";
const Swiper1: React.FC = () => {
  return (
    <Swiper
      spaceBetween={30}
      centeredSlides={true}
      autoplay={{
        delay: 5000,
        disableOnInteraction: false,
      }}
      pagination={{
        clickable: true,
      }}
      navigation={true}
      modules={[Autoplay, Pagination, Navigation]}
      className="mySwiper">
      <SwiperSlide>Slide 1</SwiperSlide>
      <SwiperSlide>Slide 2</SwiperSlide>
      <SwiperSlide>Slide 3</SwiperSlide>
      //More, saving space for the error
    </Swiper>
  );
};
export default Swiper1;
TS2322: Type '{ children: Element[]; spaceBetween: number; centeredSlides: boolean; autoplay: { delay: number; disableOnInteraction: boolean; }; pagination: { clickable: boolean; }; navigation: boolean; modules: any[]; className: string; }' is not assignable to type 'IntrinsicAttributes & RefAttributes<SwiperRef> & SwiperProps'.
  Property 'spaceBetween' does not exist on type 'IntrinsicAttributes & RefAttributes<SwiperRef> & SwiperProps'.
     8 |   return (
     9 |     <Swiper
> 10 |       spaceBetween={30}
       |       ^^^^^^^^^^^^
    11 |       centeredSlides={true}
    12 |       autoplay={{
    13 |         delay: 5000,

I tried to search the problem on google,chatgpt and other websites. I updated the TS vers in my project to v5.1.6 and I asked for help on reactjs discord server. I was expecting to get a response to my error,but not luck...

0 Answers0