kaiPingWeb/code/src/components/NotFound/index.tsx

import history from "@/utils/history";
import { Button, Result } from "antd";
import { useEffect, useRef } from "react";

export default function NotFound() {
  const timeRef = useRef(-1);

  useEffect(() => {
    timeRef.current = window.setTimeout(() => {
      const dom: HTMLDivElement = document.querySelector(".noFindPage")!;
      dom.style.opacity = "1";
    }, 300);
    return () => {
      clearTimeout(timeRef.current);
    };
  }, []);

  return (
    <div className="noFindPage">
      <Result status="404" title="404" subTitle="找不到页面" />
      <div style={{ display: "flex", justifyContent: "center" }}>
        <Button type="primary" onClick={() => history.push("/")}>
          首页
        </Button>
        &emsp;
        <Button onClick={() => history.go(-1)}>返回</Button>
      </div>
    </div>
  );
}