revert 还原循环监听
This commit is contained in:
yezian 2024-08-07 16:51:32 +08:00
parent bdb08aca6c
commit d976b642ff
5 changed files with 35 additions and 15 deletions

View File

@ -76,6 +76,7 @@ export default function Home() {
</div>
<Swiper
direction="horizontal"
allowTouchMove={false}
loop={false}
indicator={() => null}
ref={swiperRef}
@ -255,7 +256,7 @@ const FollowPostList = forwardRef(({ scrollHeight }, ref) => {
}
);
// debugger;
// console.log("offset", followsResponse.data.offset);
console.log("offset", followsResponse.data.offset);
setOffset(followsResponse.data.offset);
setHasMore(followsResponse.data.more);
setLoading(false);

View File

@ -4,7 +4,7 @@ import React, { useState, useEffect } from "react";
import { Image } from "antd-mobile";
import { get,save } from "@/utils/storeInfo";
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
import { faClose } from "@fortawesome/free-solid-svg-icons";
import { faAngleUp, faClose } from "@fortawesome/free-solid-svg-icons";
export default function AddToHome() {
const [firstLogin, setFirstLogin] = useState({ first: "0", second: false });
useEffect(() => {

View File

@ -8,6 +8,7 @@ import { useRouter } from "next/navigation";
import baseRequest from "@/utils/baseRequest";
import Player from "next-video/player";
// import ImagesMask from "@/components/ImagesMask";
// import Viewer from 'react-viewer';
export default function Photos({
isUnlocked,
mediaVisibleRange,
@ -62,15 +63,15 @@ export default function Photos({
}, [media]);
const showPhotos = (photos, index) => {
currentIndex.current = index;
const interval = setInterval(() => {
const bodyBox = document.getElementsByClassName("photos-bodyBox")[0];
if (bodyBox) {
bodyBox.firstChild.lastChild.style.transform = `translateX(-${
currentIndex.current * (window.innerWidth + 16)
}px)`;
// console.log(bodyBox.firstChild.lastChild.style.transform);
}
}, 400);
// const interval = setInterval(() => {
// const bodyBox = document.getElementsByClassName("photos-bodyBox")[0];
// if (bodyBox) {
// bodyBox.firstChild.lastChild.style.transform = `translateX(-${
// currentIndex.current * (window.innerWidth + 16)
// }px)`;
// // console.log(bodyBox.firstChild.lastChild.style.transform);
// }
// }, 400);
// 添加左右切换按钮
const btns = document.createElement("div");
@ -80,7 +81,7 @@ export default function Photos({
btnL.addEventListener("click", () => {
if (currentIndex.current > 0) {
currentIndex.current = currentIndex.current - 1;
handleShowImages(currentIndex.current, photos, btns,interval);
handleShowImages(currentIndex.current, photos, btns);
if (!currentIndex.current) {
btnL.style.opacity = 0.5;
btnR.style.opacity = 1;
@ -95,7 +96,7 @@ export default function Photos({
btnR.addEventListener("click", () => {
if (currentIndex.current < currentPhotos.length - 1) {
currentIndex.current = currentIndex.current + 1;
handleShowImages(currentIndex.current, photos, btns,interval);
handleShowImages(currentIndex.current, photos, btns);
if (currentIndex.current == currentPhotos.length - 1) {
btnR.style.opacity = 0.5;
btnL.style.opacity = 1;
@ -106,7 +107,7 @@ export default function Photos({
}
});
btns.append(btnL, btnR);
handleShowImages(index, photos, btns,interval);
handleShowImages(index, photos, btns);
// setVisible(true)
// imagesMaskRef.current.show(photos.map((item) => item?.url),index)
@ -150,7 +151,7 @@ export default function Photos({
},
afterClose: () => {
mediaDom.remove();
clearInterval(interval);
// clearInterval(interval);
},
classNames: { body: "photos-bodyBox" },
});

17
package-lock.json generated
View File

@ -26,6 +26,7 @@
"react-dom": "^18",
"react-player": "^2.16.0",
"react-redux": "^9.1.2",
"react-viewer": "^3.2.2",
"redux": "^5.0.1",
"sass": "^1.77.6"
},
@ -5876,6 +5877,14 @@
}
}
},
"node_modules/react-viewer": {
"version": "3.2.2",
"resolved": "https://registry.npmmirror.com/react-viewer/-/react-viewer-3.2.2.tgz",
"integrity": "sha512-DHOq1x6cXsAViY43204ILRzLVR5ovP1MgzsC+LzZCWlInRuHjzAgpQZ8GzWm1CkiNYuHGwCxH36X0JUHl2xDSg==",
"dependencies": {
"classnames": "^2.2.5"
}
},
"node_modules/read-cache": {
"version": "1.0.0",
"resolved": "https://registry.npmmirror.com/read-cache/-/read-cache-1.0.0.tgz",
@ -11195,6 +11204,14 @@
"use-sync-external-store": "^1.0.0"
}
},
"react-viewer": {
"version": "3.2.2",
"resolved": "https://registry.npmmirror.com/react-viewer/-/react-viewer-3.2.2.tgz",
"integrity": "sha512-DHOq1x6cXsAViY43204ILRzLVR5ovP1MgzsC+LzZCWlInRuHjzAgpQZ8GzWm1CkiNYuHGwCxH36X0JUHl2xDSg==",
"requires": {
"classnames": "^2.2.5"
}
},
"read-cache": {
"version": "1.0.0",
"resolved": "https://registry.npmmirror.com/read-cache/-/read-cache-1.0.0.tgz",

View File

@ -27,6 +27,7 @@
"react-dom": "^18",
"react-player": "^2.16.0",
"react-redux": "^9.1.2",
"react-viewer": "^3.2.2",
"redux": "^5.0.1",
"sass": "^1.77.6"
},