nextjsのRouterを使って新しいタブで開かせる方法

Question

前提・実現したいこと

nextjsの関数内で新しいタブでリンクを開かせたい

発生している問題

以下に似た形で新しいタブで開かせたいです。
同じタブでリンクを開くことはできています。

注意：色々処理終わらせたあとでリンクに飛ばしたいため、Link(<a>)は使えないと考えています。

該当のソースコード

import { useRouter } from 'next/router'

export default function Page() {
  const router = useRouter()
  const handleClick = () => {
    ~~~色々処理入れる~~~~
    router.push('/new_page')
  }

  return (
    <button type="button" onClick={handleClick}>
      Click me
    </button>
  )
}

Comments

[hoshi-takanori]

<a target="_blank" href="/new_page"> では駄目でしようか？

[blo]

コメントありがとうございます！
そして申し訳ないです、例ではクリックしかしないように見えますが、
やりたいこととしては、色々な処理を入れたあとにリンクを飛ばしたいと考えております。

そのためaタグは使えないです。

[hoshi-takanori]

なら window.open('/new_page', '_ blank'); ですかね。
https://github.com/vercel/next.js/issues/8279

ちなみに、新しいタブを開くと JS の環境も現在のタブとは別になりますが、大丈夫でしょうか。

[blo]

ありがとうございます！！
リンク見ました、オプションで、ないんですね

window.open使う考えはなかったです。これ使って実装してみます。
stateなど使う予定は今の所ないので大丈夫です！助かりました。