caszl-next/app/components/ArticleRender.tsx

import { ArticleDetail } from "@/app/types/article";
import Link from "next/link";
import ArticleHeading from "@/app/components/ArticleHeading";

const ArticleRender = ({ article }: { article: ArticleDetail }) => {
  return (
    <div className={"h-full"}>
      <ArticleHeading text={article.title} />
      <div dangerouslySetInnerHTML={{ __html: article.content }}></div>
      <div className={"bottom-nav mb-[50px] mt-[27px]"}>
        <div className={"prev"}>
          <span className={"text-base"}>上一篇</span>
          <Link
            className={"ml-8 text-sm text-[#666]"}
            href={`./${article.prev?.id}`}
          >
            {article.prev?.title ?? "没有了"}
          </Link>
        </div>
        <div className={"next mt-8"}>
          <span className={"text-base"}>下一篇</span>
          <Link
            className={"ml-8 text-sm text-[#666]"}
            href={`./${article.next?.id}`}
          >
            {article.next?.title ?? "没有了"}
          </Link>
        </div>
      </div>
    </div>
  );
};

export default ArticleRender;