|
@@ -1,25 +1,13 @@
|
|
|
"use client";
|
|
|
import { BannerRep } from "@/api/home";
|
|
|
import Box from "@/components/Box";
|
|
|
-import { NoticeBar, Swiper, SwiperRef } from "antd-mobile";
|
|
|
-import { FC, useEffect, useRef, useState } from "react";
|
|
|
+import { NoticeBar, Swiper } from "antd-mobile";
|
|
|
+import { FC } from "react";
|
|
|
interface Props {
|
|
|
notices: BannerRep[];
|
|
|
}
|
|
|
const HomeNoticeBar: FC<Props> = (props) => {
|
|
|
const { notices } = props;
|
|
|
- const currentIndex = useRef<NodeJS.Timeout | null>(null);
|
|
|
- const [timer, setTimer] = useState(3000);
|
|
|
- const swiperRef = useRef<SwiperRef>(null);
|
|
|
-
|
|
|
- useEffect(() => {
|
|
|
- currentIndex.current = setTimeout(() => {
|
|
|
- swiperRef.current?.swipeNext();
|
|
|
- }, timer);
|
|
|
- return () => {
|
|
|
- currentIndex.current && clearTimeout(currentIndex.current);
|
|
|
- };
|
|
|
- }, [timer]);
|
|
|
|
|
|
return (
|
|
|
<div
|
|
@@ -33,12 +21,8 @@ const HomeNoticeBar: FC<Props> = (props) => {
|
|
|
indicator={() => null}
|
|
|
style={{ height: "0.36rem" }}
|
|
|
loop
|
|
|
- onIndexChange={(index) => {
|
|
|
- const s = notices[index].content?.length! * 100;
|
|
|
- console.log(`🚀🚀🚀🚀🚀-> in HomeNoticeBar.tsx on 37`, index, s);
|
|
|
- setTimer(s);
|
|
|
- }}
|
|
|
- ref={swiperRef}
|
|
|
+ autoplay
|
|
|
+ autoplayInterval={10000}
|
|
|
>
|
|
|
{notices.map((notice, index) => (
|
|
|
<Swiper.Item key={index}>
|
|
@@ -57,7 +41,7 @@ const HomeNoticeBar: FC<Props> = (props) => {
|
|
|
width: "100%",
|
|
|
padding: 0,
|
|
|
}}
|
|
|
- speed={40}
|
|
|
+ speed={60}
|
|
|
bordered
|
|
|
content={
|
|
|
<div
|