Refetch routeData when dynamic route changes

I use a dynamic route

[slug].tsx

[slug].tsx

[slug].tsx

[slug].tsx to display a blogpost for example. To get the data of the post from the database I use

routeData

routeData

routeData

routeData in combination with

createRouteData

createRouteData

createRouteData

createRouteData. Thereby I set the

slug

slug

slug

slug as the

key

key

key

key. If I now navigate with a link between blogposts,

routeData

routeData

routeData

routeData or

createRouteData

createRouteData

createRouteData

createRouteData is not executed again, so the content of the dynamic route does not change. Is this intended or a bug? Do I need to use

refetchRouteData

refetchRouteData

refetchRouteData

refetchRouteData to trigger this myself e.g. in

createEffect

createEffect

createEffect

createEffect?

export function routeData({ params }: RouteDataArgs) {
  return {
    post: createRouteData((key) => fetch(key), { key: params.slug }),
  };
}

export default function PostPage() {
  const { post } = useRouteData<typeof routeData>();
  return (
    <Show when={post()}>
      <h1>{post()!.title}</h1>
    </Show>
  );
}

export function routeData({ params }: RouteDataArgs) {
  return {
    post: createRouteData((key) => fetch(key), { key: params.slug }),
  };
}

export default function PostPage() {
  const { post } = useRouteData<typeof routeData>();
  return (
    <Show when={post()}>
      <h1>{post()!.title}</h1>
    </Show>
  );
}

export function routeData({ params }: RouteDataArgs) {
  return {
    post: createRouteData((key) => fetch(key), { key: params.slug }),
  };
}

export default function PostPage() {
  const { post } = useRouteData<typeof routeData>();
  return (
    <Show when={post()}>
      <h1>{post()!.title}</h1>
    </Show>
  );
}

export function routeData({ params }: RouteDataArgs) {
  return {
    post: createRouteData((key) => fetch(key), { key: params.slug }),
  };
}

export default function PostPage() {
  const { post } = useRouteData<typeof routeData>();
  return (
    <Show when={post()}>
      <h1>{post()!.title}</h1>
    </Show>
  );
}

Refetch routeData when dynamic route changes

Similar Threads

Similar Threads

Similar Threads