How to programmatically navigate to a new tab with useNavigate?

Hi! I'm trying to figure out the best way to programmatically navigate to a route in a new tab using TanStack Router.

Currently I'm using

useNavigate

useNavigate

useNavigate

useNavigate like this:

const navigate = useNavigate({ from: ApplicationsRoute.fullPath })

// In a click handler:
navigate({
  to: '/applications/$a/$b/$c/data',
  params: { a, b, c },
  state: { prev: { search } }
})

const navigate = useNavigate({ from: ApplicationsRoute.fullPath })

// In a click handler:
navigate({
  to: '/applications/$a/$b/$c/data',
  params: { a, b, c },
  state: { prev: { search } }
})

const navigate = useNavigate({ from: ApplicationsRoute.fullPath })

// In a click handler:
navigate({
  to: '/applications/$a/$b/$c/data',
  params: { a, b, c },
  state: { prev: { search } }
})

const navigate = useNavigate({ from: ApplicationsRoute.fullPath })

// In a click handler:
navigate({
  to: '/applications/$a/$b/$c/data',
  params: { a, b, c },
  state: { prev: { search } }
})

I know I can use the

Link

Link

Link

Link component with

target="_blank"

target="_blank"

target="_blank"

target="_blank" for regular links, but in this case I need to do this programmatically from a click handler. Is there a built-in way to achieve this without having to use

window.open()

window.open()

window.open()

window.open() or creating a hidden

Link

Link

Link

Link component?

How to programmatically navigate to a new tab with useNavigate?

Similar Threads

Similar Threads

Similar Threads