with-url-state
Lifts the state out of a react component and into the url
This package allows applications to retrieve the state from a react component and appends it to the url.
Installation
To install with npm use
npm install with-url-state --save
To install with yarn use
yarn add with-url-state
Usage
Play with it in CodeSandbox or check out the the example/
Using javascript
const enhance = const UrlForm =
Using typescript
Using the renderprop component
Motivation
with-url-state
automates the query parameter manipulations, simplifying URL sharing for search results, querying data or tracking a visible portion of a map.
The api provided is:
- based on higer-order-components which makes it composable and testable
- has a render-prop alternative for convenience
- type-safe thanks to Typescript
- very similar to Reacts built in state apis, so converting a component which already manages state is usually as simple as replacing
setState
withsetUrlState
!