NextJS -是否可以构建使用path或query参数的系统？

// pages/users/[id].js
import { useRouter } from 'next/router';

const UserProfile = () => {
  const router = useRouter();
  const { id } = router.query;

  return (
    <div>
      <h1>User Profile</h1>
      <p>User ID: {id}</p>
    </div>
  );
};

export default UserProfile;

// pages/search.js
import { useRouter } from 'next/router';

const SearchPage = () => {
  const router = useRouter();
  const { query } = router.query;

  return (
    <div>
      <h1>Search Results</h1>
      <p>Search Query: {query}</p>
    </div>
  );
};

export default SearchPage;

// pages/posts/[slug].js
import { useRouter } from 'next/router';

const Post = () => {
  const router = useRouter();
  const { slug } = router.query;

  return (
    <div>
      <h1>Post</h1>
      <p>Slug: {slug}</p>
    </div>
  );
};

export default Post;

// pages/posts/[slug].js
import { useRouter } from 'next/router';

const Post = () => {
  const router = useRouter();
  const { slug } = router.query;
  const { tag } = router.query;

  return (
    <div>
      <h1>Post</h1>
      <p>Slug: {slug}</p>
      {tag && <p>Tag: {tag}</p>}
    </div>
  );
};

export default Post;