2

我正在为我的应用程序使用下一个 js,并且在路由到应用程序的上一个路由时遇到了一些问题。我知道路由器功能 back() 类似于 window.history.back(),我想在单击链接时返回路由,并且如果上一个链接不是来自我的应用程序或为空,我想默认进入主页。

我为我的 react 应用程序使用了 react-router-last-location 之类的库,但我想看看是否有更好的方法可以通过 next/router 在下一个 js 中执行此操作。

这是我的示例代码:

<div className={styles['icon-container']}>
  <Link  href="/"><a>
     <img src="icon.svg"></img>
  </a></Link>
</div>

如果我在 href 输入中使用 router.back(),页面甚至在加载之前就会自动返回,我该如何解决这个问题?

4

1 回答 1

4

<Link>不能离开您的应用程序。(但router.back()可以)

您不能router.back()直接在代码中使用,您需要执行以下操作:

<img onClick={() => router.back()} src="icon.svg" />

<Link>没有 onClick 属性。

import { useRouter } from 'next/router'

export default function Page() {
  const router = useRouter()

  return (
    <button type="button" onClick={() => router.back()}>
      Click here to go back
    </button>
  )
}

信息来源在这里

于 2021-06-16T08:55:09.570 回答