Accessing pathname inside head prop

I’m trying to access the current pathname inside the head prop of createFileRoute.

Right now, I’m doing this as a workaround by inspecting the route matches:

head: ({ matches }) => {
  const route =  matches.find(
    (route) => route.routeId !== "__root__"
  )
...

head: ({ matches }) => {
  const route =  matches.find(
    (route) => route.routeId !== "__root__"
  )
...

then use the route

{
  property: "og:url",
  content: `https://example.com${route?.pathname}`,
},

{
  property: "og:url",
  content: `https://example.com${route?.pathname}`,
},

Is there an official or recommended way to access the current pathname inside head?

TanStack•3mo ago•

7 replies

ltd-scarlet

Accessing pathname inside head prop

I’m trying to access the current pathname inside the head prop of createFileRoute.

Right now, I’m doing this as a workaround by inspecting the route matches:

head: ({ matches }) => {
  const route =  matches.find(
    (route) => route.routeId !== "__root__"
  )
...

head: ({ matches }) => {
  const route =  matches.find(
    (route) => route.routeId !== "__root__"
  )
...

then use the route

{
  property: "og:url",
  content: `https://example.com${route?.pathname}`,
},

{
  property: "og:url",
  content: `https://example.com${route?.pathname}`,
},

Is there an official or recommended way to access the current pathname inside head?

Accessing pathname inside head prop

Similar Threads

Accessing pathname inside head prop

Similar Threads

Similar Threads

Similar Threads