react-router-state

React state api which append value to quey params

Preview

Open this example on StackBlitz:


Installation

Using npm:

``bash
npm install react-router-state
`

Or using yarn:

`bash
yarn add react-router-state
`

API

$3

| Name | Type | Description |
| :----------: | :------------------------------------------: | :----------------------------: |
| defaultValue | string | default state value |
| key | string | param key to append to the url |
| value | string | current value |
| setValue | React.Dispatch> | set state value |

Example

`jsx
import { useQueryState } from 'react-router-state';

export default function () => {
const [value, setValue] = useQueryState("name", "john");

return (


)
}

`

Use cases

There are some cases that you want to have a persistance state when you share a url of you web application to someone else. For example you click on a button which opens a modal and you want to share the link and the modal should be open once the app is loaded. use can do something like this example:

`jsx
const [isOpen, setIsOpen] = useQueryState("isModalOpen", "false");

return (



);
``