feat: fix bug

Author: Qquanwei

src/client/page/comic/ChapterComic.tsx

@@ -162,14 +162,14 @@ const ChapterComic: React.FC<{ chapterList: IImgListForMultipleChapter }> = ({
 
   return (
     <>
-      <div className="flex grow relative">
+      <div className="flex relative">
         <ChapterList
           toggleChapter={toggleChapter}
           imgList={chapterList}
           value={chapter}
           onChange={setChapter}
         />
-        <div className="grow relative flex">
+        <div className="grow relative flex w-[calc(100%-320px)]">
           <ImgList
             tag={chapter.name}
             onVisitPosition={onVisitPositionChange}

src/client/page/comic/imgList.tsx

@@ -94,17 +94,19 @@ function useImgLoadAutoScrollIntoView(
   const containerRef = useRef(container);
   const firstElementOnLoadRef = useRef(firstElementOnLoad);
   containerRef.current = container;
+  const firstElePositionRef = useRef<number>(firstElePosition);
+  firstElePositionRef.current = firstElePosition;
 
   useEffect(() => {
-    if (firstElePosition < 0 || firstElePosition > imgList.length) {
+    if (firstElePosition < 0 || firstElePositionRef.current > imgList.length) {
       if (firstElementOnLoadRef.current) {
         firstElementOnLoadRef.current();
       }
     }
   }, []);
 
   const onLoad = useCallback((e) => {
-    if (Number(e.currentTarget.dataset.index) === firstElePosition) {
+    if (Number(e.currentTarget.dataset.index) === firstElePositionRef.current) {
       const target = e.currentTarget;
       if (containerRef.current) {
         containerRef.current.classList.add("scroll-smooth");
@@ -310,6 +312,7 @@ const HorizonImgList: React.FC<ImgListProps> = ({
   const [scrollingDone, setScrollingDone] = useState(false);
   const containerRef = useRef<HTMLDivElement>(null);
   useWatchComicPositionChange(!loading && scrollingDone, onVisitPosition);
+
   const { onLoad: onImgLoad } = useImgLoadAutoScrollIntoView(
     imgList,
     firstElePosition,