空-通过TypeScript在next.js中使用路由器的安全方法

// pages/index.tsx
import { useRouter } from 'next/router';

const HomePage = () => {
  const router = useRouter();

  const handleClick = () => {
    router.push('/about');
  };

  return (
    <div>
      <h1>Home Page</h1>
      <button onClick={handleClick}>Go to About</button>
    </div>
  );
};

export default HomePage;

// pages/api/users/[id].ts
import type { NextApiRequest, NextApiResponse } from 'next';

interface User {
  id: number;
  name: string;
}

const users: User[] = [
  { id: 1, name: 'Alice' },
  { id: 2, name: 'Bob' },
];

export default function handler(req: NextApiRequest, res: NextApiResponse<User | null>) {
  const { id } = req.query;
  const user = users.find((user) => user.id === parseInt(id as string));

  if (user) {
    res.status(200).json(user);
  } else {
    res.status(404).json(null);
  }
}