https://github.com/tram-one/useurlparams
🌠Hook that returns path variables based on the route
https://github.com/tram-one/useurlparams
Last synced: 9 months ago
JSON representation
🌠Hook that returns path variables based on the route
- Host: GitHub
- URL: https://github.com/tram-one/useurlparams
- Owner: Tram-One
- License: mit
- Created: 2019-09-11T05:02:59.000Z (almost 7 years ago)
- Default Branch: master
- Last Pushed: 2023-01-08T21:51:21.000Z (over 3 years ago)
- Last Synced: 2024-04-14T05:21:36.438Z (about 2 years ago)
- Language: JavaScript
- Homepage: https://www.npmjs.com/package/use-url-params
- Size: 253 KB
- Stars: 0
- Watchers: 4
- Forks: 0
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
### Description
Hook that returns path variables based on the route.
Can return path parameters, query params, and more.
It's internal functionality is powered by the package
[rlite](https://www.npmjs.com/package/rlite-router)
Rather than using XML templates to define routes, this method enables
routing in javascript using a hook like result.
### Parameters
`{String} [pattern]` - path for resolving path parameters (not required for query params)
### Returns
`{Object}` - object with a `matches` key, and (if it matched) path and query parameters
### setupUrlParams
There is an underlying function that can return the hook with a non-standard routing method. This method takes in the following parameters:
`{Function} [getPath]` - function to return the current path, defaults to reading window.location.href when using `useUrlParams`.
It returns a new hook that will resolve params based on the new function.
## Examples
Examples are based on it's usage in [Tram-One](https://tram-one.io/#use-url-params), however they should work in any view framework.
### Check Route Example
```javascript
import { registerHtml, useUrlParams } from 'tram-one'
import HomePage from './pages/home'
import UserPage from './pages/user'
import NotFoundPage from './pages/not-found'
export default () => {
if (useUrlParams('/').matches) return HomePage();
if (useUrlParams('/user').matches) return UserPage();
return NotFoundPage();
}
```
### Get Url Params Example (path is `/user/exampleUser?session=true`)
```javascript
import { registerHtml, useUrlParams } from 'tram-one'
export default () => {
const params = useUrlParams('/user/:userId')
params.userId // => exampleUser
params.session // => true
}
```
### Custom Get Path Example
```javascript
import { setupUrlParams } from 'use-url-params'
const customGetPath = () => window.location.port
export default setupUrlParams(customGetPath)
```