삭제 기능 구현후 두개 삭제하면 빈화면이 뜹니다ㅠㅠ

안녕하세요 선생님
글 삭제 기능까지 완료하고 삭제는 잘 되는데 2개 이상 삭제하면 자꾸 빈화면만 뜨고
gnb에서 list 메뉴를 눌러도 해당 화면으로 넘어가지 않습니다ㅠㅠ
근데 새로고침하면 다시 나타나긴 합니다...ㅎㅎ
2개부터는 애니메이션 효과도 볼 수 없고 gnb를 제외한 {child}부분이 전혀 나타나지 않습니다.

일단 Listirem.js는

"use client";
import Link from "next/link";
import { BiEdit, BiTrash } from "react-icons/bi";

export default function ListItem({ result }) {
  return (
    <>
      {result.map((a, i) => (
        <div className="list-item" key={i}>
          <Link href={"/detail/" + result[i]._id}>
            <h4>{result[i].title}</h4>
          </Link>
          <p>1월 1일</p>
          <Link href={"/edit/" + result[i]._id}>
            <BiEdit className="edit" />
          </Link>
          <BiTrash
            className="delete"
            onClick={(e) => {
              e.stopPropagation();
              fetch("/api/delete", {
                method: "POST",
                body: result[i]._id,
              })
                // .then((r) => {
                //   return r.json();
                // })
                .then(() => {
                  e.target.parentElement.parentElement.style.opacity = 0;
                  setTimeout(() => {
                    e.target.parentElement.parentElement.style.display = "none";
                  }, 1000);
                });
            }}
          />
        </div>
      ))}
    </>
  );
}

이렇게 짜둔 상태이고 CSS에는
.list-item {
  background: white;
  border-radius: 10px;
  padding: 20px;
  margin-bottom: 5px;
  box-shadow: rgb(224, 224, 224) 0px 2px 4px 0px;
  opacity: 1;
  transition: all 0.3s;
}
이렇게 opacity와 transition을 적용해두었구요, 
/api/delete.js에는

import { connectDB } from "@/util/database";
import { ObjectId } from "mongodb";

export default async function handler(request, answer) {
  if (request.method == "POST") {
    try {
      const db = (await connectDB).db("woolandonly");
      let result = await db
        .collection("post")
        .deleteOne({ _id: new ObjectId(request.body) });
      console.log(result);
      answer.status(200).json("처리완료");
    } catch (error) {
      answer.status(500);
    }
  }
}

이렇게 짜둔 상태입니다. 
다시 새로고침하면 list가 잘 나타나고 삭제된것도 확인할 수 있는데 2개 이상 삭제하면
그 이후부터는 게시글을 삭제할때마다 계속 흰 화면만 뜹니다ㅠㅠ 이유가 뭘까요?