getPreviousState - greydragon888/real-router GitHub Wiki
-
What it does: Returns the previous router state (state before the last navigation). The state is automatically saved on each
setState()call. -
When to use:
- To implement "back" functionality
- For route transition animations
- To compare current and previous states
- For navigation history logging
router.getPreviousState<P extends Params = Params>(): State<P> | undefinedtype State<P extends Params = Params> = {
name: string;
params: P;
path: string;
};
type Params = Record<string, unknown>;// Getting previous state
const previousState = router.getPreviousState();
if (previousState) {
console.log("Came from route:", previousState.name);
}
// Transition animation
router.subscribe(({ route, previousRoute }) => {
const prev = router.getPreviousState();
if (prev && route) {
animateTransition(prev.name, route.name);
}
});
// Conditional logic based on previous route
const prev = router.getPreviousState();
if (prev?.name === "checkout") {
showThankYouMessage();
}
// With typed parameters
interface UserParams {
id: string;
}
const prev = router.getPreviousState<UserParams>();
if (prev) {
console.log("Previous user ID:", prev.params.id);
}The method takes no parameters.
| Parameter | Default | Description |
|---|---|---|
P |
Params |
Route parameters type |
-
Type:
State<P> | undefined -
undefined: If no navigation occurred yet or router just started -
State: Previous state before lastsetState()
- Returned state is frozen (deeply frozen) — modification attempts will throw error in strict mode
- This is the state that was current BEFORE the last
setState()call - On first router start, previous state is absent
The method has no side effects — it's a pure getter function.
The method does not throw errors.
| Method | When to use |
|---|---|
getState() |
Getting current state |
navigate() |
Navigation (updates state and saves previous state) |
-
Before first navigation: Returns
undefined - After navigation: Returns state before navigation
- After multiple navigations: Returns last previous state
// Returns undefined before first navigation
expect(router.getPreviousState()).toBeUndefined();
// Returns previous state after navigation
await router.navigate("sign-in");
const previousState = router.getPreviousState();
expect(previousState).toBeDefined();
expect(previousState?.name).toBe("home");
// Updates previous state on subsequent navigations
await router.navigate("sign-in");
await router.navigate("users");
const previousState = router.getPreviousState();
expect(previousState?.name).toBe("sign-in");// Previous state preserves parameters
await router.navigate("users.view", { id: "123" });
await router.navigate("home");
const previousState = router.getPreviousState();
expect(previousState?.name).toBe("users.view");
expect(previousState?.params).toStrictEqual({ id: "123" });// State is frozen (immutable)
await router.navigate("sign-in");
const previousState = router.getPreviousState();
expect(Object.isFrozen(previousState)).toBe(true);-
Before first navigation:
undefined -
After
stop()and re-start(): Previous state is preserved until next navigation - With generic types: Returns typed state
- Returned state is immutable (deeply frozen)
- State corresponds to what was before the last navigation
-
undefinedwhen navigation history is empty - Typing through generic
P - Has no side effects
New method. Not available in router5 (master branch).
| router5 (master) | Real Router (current) | |
|---|---|---|
| Availability | Not available | Implemented |
| Tracking previous state | No | Automatic on navigation |
| Immutability | N/A | Deeply frozen |
| TypeScript generics | N/A | <P> |
- Transition animations: For smooth CSS/JS animations between routes
- Navigation history: Tracking user path
- Conditional logic: Different behavior based on where user came from
- Breadcrumbs: Building navigation chains
-
getState(): Works in parallel — returns current, whilegetPreviousState()returns previous -
navigate(): Updates state and automatically saves previous state
// Previous state tracking is now available
await router.navigate("settings");
await router.navigate("profile");
const previous = router.getPreviousState();
console.log(previous?.name); // 'settings'
// Typed access
interface MyParams {
id: string;
}
const typedPrev = router.getPreviousState<MyParams>(); // P = MyParamsNo migration required — this is a new API extending functionality.