Route not updating its routeData

Consider the following FileRoutes

/[groupId].tsx // layout
/[groupId]/(groups).tsx
/[groupId]/[matchId].tsx

/[groupId].tsx // layout
/[groupId]/(groups).tsx
/[groupId]/[matchId].tsx

Going from /groupId to /groupId/matchId will trigger [matchId]'s routeData function, but going from [matchId] to another [matchId] does not. Am I doing something wrong?

1 Reply

stiba•8mo ago

My routeData function was wrong. Changing from:

export function routeData() {
  const params = useParams<{ matchId: string }>();

  const [data] = createResource(
    async () => {
      const matchStatsResponse = await api.fetchMatch(params.matchId);
      return matchStatsResponse;
    }
  );

  return { data };
}

export function routeData() {
  const params = useParams<{ matchId: string }>();

  const [data] = createResource(
    async () => {
      const matchStatsResponse = await api.fetchMatch(params.matchId);
      return matchStatsResponse;
    }
  );

  return { data };
}

to:

export function routeData() {
  const params = useParams<{ matchId: string }>();

  const [data] = createResource(
    () => params.matchId,
    async (matchId: string) => {
      const matchStatsResponse = await api.fetchMatch(matchId);
      return matchStatsResponse;
    }
  );

  return { data };
}

export function routeData() {
  const params = useParams<{ matchId: string }>();

  const [data] = createResource(
    () => params.matchId,
    async (matchId: string) => {
      const matchStatsResponse = await api.fetchMatch(matchId);
      return matchStatsResponse;
    }
  );

  return { data };
}

fixes the issue and everything works as expected.

Gaming

Programming

Route not updating its routeData