Route Data to Pass Signal to Children Components

Hi. I'm trying to pass a signal from a great grandparent to a its great grand children.
In (home).jsx I have this:

const [selectedFont, setSelectedFont] = createSignal('inter')

export function routeData() {
  return selectedFont()
}

const [selectedFont, setSelectedFont] = createSignal('inter')

export function routeData() {
  return selectedFont()
}

const [selectedFont, setSelectedFont] = createSignal('inter')

export function routeData() {
  return selectedFont()
}

const [selectedFont, setSelectedFont] = createSignal('inter')

export function routeData() {
  return selectedFont()
}

In the great grand child I have this:

  const font = useRouteData()

  createEffect(() => {
    console.log(font)
  })

  const font = useRouteData()

  createEffect(() => {
    console.log(font)
  })

  const font = useRouteData()

  createEffect(() => {
    console.log(font)
  })

  const font = useRouteData()

  createEffect(() => {
    console.log(font)
  })

But font is never updated in the great grand child. The great grand child gets the original value(inter) but it doesn't appear to be updating. I've confirmed it's changing in (home).jsx. I also tried to using createRouteData() in (home).jsx

Route Data to Pass Signal to Children Components

Similar Threads

Similar Threads

Similar Threads