title: How do I pass an href to an onClick function in nextjs?
body: <p>In the following code</p>
  <pre><code>import Link from &quot;next/link&quot;;
  
  export default function IndexPage() {
    const handleClick = (path) =&gt; {
      if (path === &quot;/about&quot;) {
        console.log(&quot;I clicked on the About Page&quot;);
      }
      if (path === &quot;/posts&quot;) {
        console.log(&quot;I clicked on the Posts Page&quot;);
      }
    };
    return (
      &lt;div&gt;
        Hello World.{&quot; &quot;}
        &lt;Link onClick={() =&gt; handleClick(&quot;/about&quot;)} href=&quot;/about&quot;&gt;
          &lt;a&gt;About&lt;/a&gt;
        &lt;/Link&gt;
        &lt;Link onClick={() =&gt; handleClick(&quot;/posts&quot;)} href=&quot;/posts&quot;&gt;
          &lt;a&gt;Posts&lt;/a&gt;
        &lt;/Link&gt;
      &lt;/div&gt;
    );
  </code></pre>
  <p>Whenever the about or posts page is clicked, I'd like to <code>console.log</code> that I clicked on the page name. Right now, my current implementation does not <code>console.log</code> anything. What is wrong with my code?</p>