Skip to content

Commit

Permalink
Docs for useRoute.
Browse files Browse the repository at this point in the history
  • Loading branch information
molefrog committed Jan 31, 2024
1 parent 0822734 commit 1455d06
Showing 1 changed file with 12 additions and 8 deletions.
20 changes: 12 additions & 8 deletions README.md
Expand Up @@ -167,20 +167,24 @@ Import from `wouter` module.

## Hooks API

### `useRoute`: the power of HOOKS!
### `useRoute`: route patterns and parameters

Hooks make creating custom interactions such as route transitions or accessing router directly
easier. You can check if a particular route matches the current location by using a `useRoute` hook:
Checks if current location matches the pattern provided and returns an object with parameters. This is powered by a wounderful [`regexparam`](https://github.com/lukeed/regexparam) library, so all its pattern syntax is fully supported.

You can use `useRoute` to perform manual routing or implement custom logic such as route transitions etc.

```js
import { useRoute } from "wouter";
import { Transition } from "react-transition-group";

const AnimatedRoute = () => {
// `match` is boolean
const [match, params] = useRoute("/users/:id");
const Users = () => {
// `match` is a boolean
const [match, params] = useRoute("/users/:name");

return <Transition in={match}>Hi, this is: {params.id}</Transition>;
if (match) {
return <>Hello, {params.name}!</>;
} else {
return null;
}
};
```

Expand Down

0 comments on commit 1455d06

Please sign in to comment.