caszl-next/app/components/ArticleContent.tsx

import React from "react";
import { ArticleDetail } from "@/app/types/article";
import Link from "next/link";

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

export default ArticleContent;