use-query-params
Advanced tools
Comparing version 0.1.0 to 0.1.1
{ | ||
"name": "use-query-params", | ||
"version": "0.1.0", | ||
"version": "0.1.1", | ||
"description": "React Hook for managing state in URL query parameters with easy serialization.", | ||
@@ -20,3 +20,3 @@ "main": "lib/index.js", | ||
"type": "git", | ||
"url": "github.com/pbeshai/use-query-params" | ||
"url": "https://github.com/pbeshai/use-query-params.git" | ||
}, | ||
@@ -23,0 +23,0 @@ "keywords": [ |
@@ -7,2 +7,7 @@ <div align="center"> | ||
<p> | ||
<img alt="npm" src="https://img.shields.io/npm/v/use-query-params.svg"> | ||
</p> | ||
<hr /> | ||
@@ -31,2 +36,3 @@ | ||
Link your routing system (e.g., [React Router example](https://github.com/pbeshai/use-query-params/blob/master/examples/react-router/src/index.tsx), [Reach Router example](https://github.com/pbeshai/use-query-params/blob/master/examples/reach-router/src/index.tsx)): | ||
```js | ||
@@ -53,2 +59,3 @@ import React from 'react'; | ||
Add the hook to your component. There are two options: `useQueryParam`: | ||
```js | ||
@@ -77,2 +84,3 @@ import * as React from 'react'; | ||
Or `useQueryParams`: | ||
```js | ||
@@ -165,2 +173,3 @@ import * as React from 'react'; | ||
**Example** | ||
```js | ||
@@ -174,2 +183,3 @@ import { ArrayParam, useQueryParam, useQueryParams } from 'use-query-params'; | ||
``` | ||
<br/> | ||
@@ -196,2 +206,3 @@ | ||
**Example** | ||
```js | ||
@@ -223,2 +234,3 @@ import { useQueryParam, NumberParam } from 'use-query-params'; | ||
**Example** | ||
```js | ||
@@ -256,2 +268,3 @@ import { useQueryParams, StringParam, NumberParam } from 'use-query-params'; | ||
``` | ||
<br/> | ||
@@ -273,2 +286,3 @@ | ||
**Example** | ||
```js | ||
@@ -286,2 +300,3 @@ import { stringify } from 'query-string'; | ||
#### QueryParamProvider | ||
```js | ||
@@ -307,2 +322,3 @@ // Use one of these: | ||
**Example (Reach Router)** | ||
```js | ||
@@ -324,2 +340,3 @@ import React from 'react'; | ||
``` | ||
<br/> | ||
@@ -326,0 +343,0 @@ |
349
46940
18
997