修复bug
This commit is contained in:
al
parent
239ddd82e3
commit
8899b66b0c
26
app/page.js
26
app/page.js
|
|
@ -207,10 +207,10 @@ const FollowPostList = forwardRef(({ scrollHeight }, ref) => {
|
|||
const [followPostList, setFollowPostList] = useState([]);
|
||||
const [currentTime, setCurrentTime] = useState();
|
||||
const [offset, setOffset] = useState(0);
|
||||
const [ids, setIds] = useState([]);
|
||||
const ids = useRef(null)
|
||||
useEffect(() => {
|
||||
getFollowIds().then((res) => {
|
||||
setIds(res);
|
||||
ids.current=res;
|
||||
getFollowPostList(res, 0);
|
||||
});
|
||||
}, []);
|
||||
|
|
@ -229,10 +229,10 @@ const FollowPostList = forwardRef(({ scrollHeight }, ref) => {
|
|||
// });
|
||||
// throw new Error("刷新失败");
|
||||
// getRecommPostList(1);
|
||||
await getFollowPostList(ids, 0);
|
||||
await getFollowPostList(ids.current, 0);
|
||||
}
|
||||
async function loadMore() {
|
||||
await getFollowPostList(ids, offset);
|
||||
await getFollowPostList(ids.current, offset);
|
||||
// const newList = [...followPostList, ...list];
|
||||
// setFollowPostList(newList);
|
||||
}
|
||||
|
|
@ -250,6 +250,14 @@ const FollowPostList = forwardRef(({ scrollHeight }, ref) => {
|
|||
return data;
|
||||
};
|
||||
const getFollowPostList = async (data, offset) => {
|
||||
console.log("ids", data);
|
||||
if(!offset){
|
||||
window.scrollTo({
|
||||
top: 0,
|
||||
left: 0,
|
||||
behavior: "smooth", // 可选，平滑滚动效果
|
||||
});
|
||||
}
|
||||
if (data.data.list.length > 0) {
|
||||
//查关注主播展示资料
|
||||
const followsResponse = await requireAPI(
|
||||
|
|
@ -276,7 +284,15 @@ const FollowPostList = forwardRef(({ scrollHeight }, ref) => {
|
|||
// position: "top",
|
||||
// });
|
||||
} else {
|
||||
setFollowPostList((old) => [...old, ...followsResponse.data.list]);
|
||||
|
||||
setFollowPostList((old) => {
|
||||
if(followsResponse.data.offset==4){
|
||||
|
||||
return followsResponse.data.list;
|
||||
}else{
|
||||
return [...old, ...followsResponse.data.list]
|
||||
}
|
||||
});
|
||||
}
|
||||
} else {
|
||||
setLoading(false);
|
||||
|
|
|
|||
|
|
@ -36,15 +36,15 @@ export default function Photos({
|
|||
type: "img",
|
||||
url: item.urls?.[0],
|
||||
// fullwidth:item.w>item.h，
|
||||
w:item.w,
|
||||
h:item.h,
|
||||
w: item.w,
|
||||
h: item.h,
|
||||
}));
|
||||
let videoArr = media.videos.map((item) => ({
|
||||
type: "video",
|
||||
url: item.cover_urls?.[0],
|
||||
mp4: item.urls?.[0],
|
||||
w:item.cover_w,
|
||||
h:item.cover_h,
|
||||
w: item.cover_w,
|
||||
h: item.cover_h,
|
||||
// fullwidth:item.cover_w>item.cover_h
|
||||
}));
|
||||
let arr = [...imgArr, ...videoArr];
|
||||
|
|
@ -60,6 +60,8 @@ export default function Photos({
|
|||
mp4: newPhotos[0]?.type === "video",
|
||||
url: newPhotos[0]?.url,
|
||||
type: "hid",
|
||||
w: newPhotos[0]?.w,
|
||||
h: newPhotos[0]?.h,
|
||||
};
|
||||
});
|
||||
}
|
||||
|
|
@ -71,15 +73,15 @@ export default function Photos({
|
|||
setCurrentPhotos(newPhotos);
|
||||
}
|
||||
}, [media]);
|
||||
useEffect(()=>{
|
||||
useEffect(() => {
|
||||
// window.addEventListener('resize', (e)=>{
|
||||
// // alert(window.innerHeight)
|
||||
// setMaskHeight(window.innerHeight)
|
||||
// });
|
||||
return ()=>{
|
||||
return () => {
|
||||
// window.removeEventListener("resize")
|
||||
}
|
||||
},[])
|
||||
};
|
||||
}, []);
|
||||
const showPhotos = (photos, index) => {
|
||||
currentIndex.current = index;
|
||||
const interval = setInterval(() => {
|
||||
|
|
@ -144,7 +146,7 @@ export default function Photos({
|
|||
photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
|
||||
}`;
|
||||
// mediaDom.appendChild(btns);
|
||||
document.body.style.overflow = 'hidden';
|
||||
document.body.style.overflow = "hidden";
|
||||
ImageViewer.clear();
|
||||
ImageViewer.Multi.show({
|
||||
images: photos.map((item) => item?.url),
|
||||
|
|
@ -159,25 +161,29 @@ export default function Photos({
|
|||
mediaDom.className = `${
|
||||
photos[index]?.type == "hid" ? "mediaDom photos-body" : "mediaDom"
|
||||
}`;
|
||||
const leftBtn = document.getElementsByClassName("imagesBtnsControllerLeft")[0]
|
||||
const rightBtn = document.getElementsByClassName("imagesBtnsControllerRight")[0]
|
||||
if(leftBtn && rightBtn){
|
||||
if(!index){
|
||||
leftBtn.style.opacity=0.5
|
||||
rightBtn.style.opacity=1
|
||||
}else if(index==currentPhotos.length-1){
|
||||
leftBtn.style.opacity=1
|
||||
rightBtn.style.opacity=0.5
|
||||
}else{
|
||||
leftBtn.style.opacity=1
|
||||
rightBtn.style.opacity=1
|
||||
const leftBtn = document.getElementsByClassName(
|
||||
"imagesBtnsControllerLeft"
|
||||
)[0];
|
||||
const rightBtn = document.getElementsByClassName(
|
||||
"imagesBtnsControllerRight"
|
||||
)[0];
|
||||
if (leftBtn && rightBtn) {
|
||||
if (!index) {
|
||||
leftBtn.style.opacity = 0.5;
|
||||
rightBtn.style.opacity = 1;
|
||||
} else if (index == currentPhotos.length - 1) {
|
||||
leftBtn.style.opacity = 1;
|
||||
rightBtn.style.opacity = 0.5;
|
||||
} else {
|
||||
leftBtn.style.opacity = 1;
|
||||
rightBtn.style.opacity = 1;
|
||||
}
|
||||
}
|
||||
},
|
||||
afterClose: () => {
|
||||
mediaDom.remove();
|
||||
clearInterval(interval);
|
||||
document.body.style.overflow = 'auto';
|
||||
document.body.style.overflow = "auto";
|
||||
},
|
||||
classNames: { body: "photos-bodyBox" },
|
||||
});
|
||||
|
|
@ -216,6 +222,7 @@ export default function Photos({
|
|||
)
|
||||
);
|
||||
}}
|
||||
style={{ marginTop: "calc(-85px )" }}
|
||||
>
|
||||
此内容暂未解锁，立即解锁
|
||||
</div>
|
||||
|
|
@ -226,7 +233,9 @@ export default function Photos({
|
|||
<>
|
||||
<div
|
||||
className={`${
|
||||
currentPhotos.length > 1 ? "grid grid-cols-3 gap-1.5 min-h-[24vw]" : "w-max"
|
||||
currentPhotos.length > 1
|
||||
? "grid grid-cols-3 gap-1.5 min-h-[24vw]"
|
||||
: "auto"
|
||||
}`}
|
||||
>
|
||||
{currentPhotos.map((item, index) => {
|
||||
|
|
@ -266,12 +275,24 @@ export default function Photos({
|
|||
placeholder={
|
||||
<div className="w-full min-h-[24vw] bg-[#1d1d1d] rounded"></div>
|
||||
}
|
||||
width={currentPhotos.length > 1 ? "24vw" : item.w>item.h?`calc(100vw - 72px - 2rem)`:`calc(46vw * ${item.w/item.h})`}
|
||||
height={currentPhotos.length > 1 ? "24vw" : item.w>item.h? `calc((100vw - 72px - 2rem) * ${item.h/item.w})`:"46vw"}
|
||||
width={
|
||||
currentPhotos.length > 1
|
||||
? "24vw"
|
||||
: item.w > item.h
|
||||
? `calc(100vw - 72px - 2rem)`
|
||||
: `calc(46vw * ${item.w / item.h})`
|
||||
}
|
||||
height={
|
||||
currentPhotos.length > 1
|
||||
? "24vw"
|
||||
: item.w > item.h
|
||||
? `calc((100vw - 72px - 2rem) * ${item.h / item.w})`
|
||||
: "46vw"
|
||||
}
|
||||
className={`rounded max-w-full ${
|
||||
item?.type == "hid" && type == "space" ? "imageBlur" : ""
|
||||
}`}
|
||||
fit={currentPhotos.length > 1?"cover":"contain"}
|
||||
fit={currentPhotos.length > 1 ? "cover" : "contain"}
|
||||
src={item?.url}
|
||||
/>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Reference in New Issue