Gatsby:如何创建将当前页面标记为活动页面的动态导航？

import React from "react";
import { Link } from "react-router-dom";

const Navigation = () => {
  return (
    <nav>
      <ul>
        <li>
          <Link to="/" activeClassName="active">Home</Link>
        </li>
        <li>
          <Link to="/about" activeClassName="active">About</Link>
        </li>
        <li>
          <Link to="/contact" activeClassName="active">Contact</Link>
        </li>
      </ul>
    </nav>
  );
};

import React from "react";
import Navigation from "../components/Navigation";

const HomePage = () => {
  return (
    <div>
      <Navigation />
      <h1>Home Page</h1>
      {/* 页面内容 */}
    </div>
  );
};

export default HomePage;