reactjs - Next.js 链接组件防止默认 Action

Question

使用 Next.js 时，我有一个显示为按钮的链接组件，但我希望用户只有在满足某些条件(已验证)时才能导航到/login。当前正在调用 handleClick 函数并返回 false，因为它应该如此，但是无论如何应用程序都会导航。

我做错了什么？

运行 next.js V 7.0.2

非常感谢。

  <Link href="/login"> 
  <button onClick={() => {handleClick(event)}}>Buyer</button> 
  </Link>

  function handleClick(event)
  {
     if(verified == false)
     {
         event.preventDefault();
         return false;
     }
     else
     {
         return true;
     }
  }

Answer 1

关于我的评论，我刚刚查看了 next.js 的文档，它给出了一个 DOM 元素示例和一个更改到另一个页面的点击事件。 https://github.com/zeit/next.js/#imperatively

从外观上看，您将要导入 Router，然后添加 Router.push('/login')，例如:

    function handleClick(event)
  {
     if(verified) {
         Router.push('/login')
     }
  }