Bladeren bron

fix: swiper init

Before 1 jaar geleden
bovenliggende
commit
1128ec682a
1 gewijzigde bestanden met toevoegingen van 7 en 1 verwijderingen
  1. 7 1
      src/components/Layout/index.tsx

+ 7 - 1
src/components/Layout/index.tsx

@@ -2,7 +2,7 @@
 import Footer, { FooterProps } from "@/components/Footer";
 import Header, { HeaderProps } from "@/components/Header";
 import Sidebar from "@/components/Layout/Sidebar";
-import { FC, PropsWithChildren, useRef } from "react";
+import { FC, PropsWithChildren, useEffect, useRef, useState } from "react";
 import { Swiper, SwiperClass, SwiperSlide } from "swiper/react";
 import styles from "./style.module.scss";
 type Props = FooterProps & HeaderProps;
@@ -14,6 +14,11 @@ const Layout: FC<PropsWithChildren<Props>> = (props) => {
     const homeContainerRef = useRef<HTMLDivElement>(null);
     const barRef = useRef<HTMLDivElement>(null);
 
+    const [mounted, setMounted] = useState(false);
+
+    useEffect(() => {
+        setMounted(true);
+    }, []);
     const startHandler = () => {
         homeContainerRef.current?.classList.add(styles.containerMask);
         barRef.current?.classList.add(styles.cross);
@@ -32,6 +37,7 @@ const Layout: FC<PropsWithChildren<Props>> = (props) => {
             swiperRef.current?.slidePrev();
         }
     };
+    if (!mounted) return null;
     return (
         <Swiper
             initialSlide={1}