feat: 修改swiper

src/components/Manufacturer/index.tsx

@@ -15,9 +15,13 @@ const HomeProvider: React.FC<Props> = ({ data }) => {
     const router = useRouter();
 
     const renderData = useMemo<GameListRep[]>(() => {
-        const result = data?.game_list?.map((item) => {
+        if (!data?.game_list?.length) return [];
+        const result = data.game_list.map((item: any) => {
+            // const randomStr = parseInt(`${Math.random() * 1000000}`);
+            // item.uid = `${item.id}-${randomStr}`;
             return item;
         });
+
         return [...result];
     }, [data]);
 
@@ -37,10 +41,11 @@ const HomeProvider: React.FC<Props> = ({ data }) => {
     };
 
     const slidesPerView = useMemo(() => {
-        if (renderData.length >= 5) return 5;
+        if (renderData.length > 5) return 5;
+        if (renderData.length === 5) return 3;
         return renderData.length % 2 === 1 ? renderData.length : renderData.length - 1;
     }, [renderData]);
-
+    console.log(slidesPerView);
     return (
         <div className={styles.container}>
             <Swiper
@@ -52,15 +57,17 @@ const HomeProvider: React.FC<Props> = ({ data }) => {
                 loop={true} // 仅在数据量足够时启用 loop
                 onSlideChange={(swiper) => {
                     setActIdx(swiper.activeIndex);
-                    // console.log('当前 active 的 slide 索引:', swiper.activeIndex);
                 }}
                 pagination={{}}
             >
-                {renderData?.map((item, idx) => (
+                {renderData?.map((item: any, idx) => (
                     <SwiperSlide
                         key={item.id}
                         className={clsx(styles.manufactureritem)}
                         onClick={() => todoHandler(item)}
+                        style={{
+                            width: "100px", // 确保每个项目都有相同的宽度
+                        }}
                     >
                         <img src={item.game_icon} className={styles.providerIcon}></img>
                         {/* <div className={clsx(styles.providerText, "text-[12px]")}>