Agile育成ブログ
未来を変える喜びを
未分類

useRouter


Warning: count(): Parameter must be an array or an object that implements Countable in /home/xs638785/agile-software.site/public_html/wp-content/plugins/rich-table-of-content/functions.php on line 490

router.push

クライアント側の遷移処理をおこないます。

基本的な書き方は、router.push(url, as, options);です。

router.back

履歴を1つ戻します。(ブラウザバック、戻るボタンクリックと同じ挙動)
window.history.back()と同様。

router.back

リロード(更新)します。
window.location.reload()と同様。

useRouterとRouterの違い

import { useRouter } from 'next/router'

const router = useRouter()

router.push("/")
import Router from 'next/router'

Router.push("/")

明確な違いは、 useRouter がフックであり、 Router がただのグローバルな変数にすぎないという点です。
すなわち useRouter を参照しているコンポーネントは、ページのパスが変わるたびに再描画されます。
それに対して、 Router を参照しているコンポーネントは、ページパスが変化してもコンポーネントが再描画されることはありません。

You cannot copy content of this page