You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: README.md
+2-2Lines changed: 2 additions & 2 deletions
Original file line number
Diff line number
Diff line change
@@ -6,7 +6,7 @@ React hooks to manage your application state using the URL query string ([search
6
6
7
7
use-query-params-state aims to improve the end user experience by providing a solution helping developers creating more shareable React web application. It is doing so by making URL state management easy, reliable and type safe and therefore encouraging developers to use the URL query string more often.
8
8
9
-
Note: Not all the states of your application can/should be stored in the URL. use-query-params-state is typically suited to manage states corresponding to parameters manipulated by the user that influences the current page.
9
+
**Note:** Not all the states of your application can/should be stored in the URL. use-query-params-state is typically suited to manage states corresponding to parameters manipulated by the user that influence the current page.
10
10
11
11
Example of URL state using use-query-params-state:
12
12
```js
@@ -174,7 +174,7 @@ Note: When updating the query params state, the change is automatically reflecte
174
174
175
175
### Usage of useQueryParamsState across multiple components
176
176
177
-
If you want to call useQueryParamsState in multiple components and want to avoid having to specify the schema each time,
177
+
If you want to call useQueryParamsState in multiple components and want to avoid having to pass the schema each time,
178
178
you can use the [createUseQueryParamsStateHook](doc/API_REFERENCE.md#createUseQueryParamsStateHook) factory.
Copy file name to clipboardExpand all lines: doc/API_REFERENCE.md
+17-11Lines changed: 17 additions & 11 deletions
Original file line number
Diff line number
Diff line change
@@ -18,7 +18,7 @@ Each factory follow the same function signature:
18
18
*Note: `T` represent the actual type of the value (number | string | boolean | string[] | number[]), depending on the factory function used.*
19
19
20
20
### Arguments
21
-
- **defaultValue? (T | DefaultValueFunction<T> | null | undefined)**: Serve as a substitute to the param value when the param is not present in the query string. When defaultValue is a function, the provided function will be executed each time we need to read the state and its return value will be used as a default value
21
+
- **defaultValue? (T | DefaultValueFunction<T> | null | undefined)**: Serve as a substitute to the param value when the param is not present in the query string. When defaultValue is a function, the provided function will be executed each time we need to read the state and its return value will be used as a default value.
22
22
23
23
### Returns
24
24
- **(QueryParamDef<T>)**: A QueryParamDef instance is defining what type the associated parameter should be. This is necessary to automatically stringify/parse the parameter to/from the URL and perform some type checking (Typescript + Javascript) when getting/setting the param . `QueryParamDef<T>` will only accept the value to be set to `T|null|undefined`.
@@ -72,16 +72,16 @@ Hook to manipulate your query params state.
72
72
#### QueryParams
73
73
Object following the shape defined in your schema representing the current state. The key is the name of your parameter and the value is the current value of the parameter. When one parameter does not currently exist in the query string, its value will be `undefined` or the default value you potentially provided when creating the schema.
74
74
75
-
### QueryParamsSetter
75
+
#### QueryParamsSetter
76
76
Function to call when updating the state of your query parameters. Calling that function will update the current URL query string and will automatically re-render your components with the new query params state.
77
77
78
78
The function has the following signature:
79
79
80
80
#### Arguments
81
81
- **newQueryParams (Partial<QueryParams>)**: Object with the query params key/value you want to update.
82
-
- **isPartialUpdate? (boolean)**: Define if the update should be applied on top of the current query params state or not. Default to true
83
-
- If true, the new query params will be applied on top of the current query params state (i.e: `constnewState= { ...oldState, ...newQueryParams }`.
84
-
- If false, the new query params will be applied on top of an empty object, (i.e: `constnewState= { ...newQueryParams }`). This can also be used to reset the state.
82
+
- **isPartialUpdate? (boolean)**: Define if the update should be applied on top of the current query params state or not. Default to `true`.
83
+
- If `true`, the new query params will be applied on top of the current query params state (i.e: `constnewState= { ...oldState, ...newQueryParams }`.
84
+
- If `false`, the new query params will be applied on top of an empty object, (i.e: `constnewState= { ...newQueryParams }`). This can also be used to reset the state.
85
85
86
86
87
87
### Example
@@ -115,7 +115,7 @@ function MyComponent() {
115
115
}
116
116
```
117
117
118
-
If you need to dynamically change your config base on your component props, you can also do it.
118
+
*Note: If you need to dynamically change your config base on your component props, you can also do it.*
119
119
120
120
```js
121
121
function MyComponent(props) {
@@ -135,7 +135,7 @@ Sometimes it's just easier to treat each query param as an independent state, yo
135
135
- **contextData?** (any): The context data
136
136
137
137
### Returns
138
-
- **([T | null | undefined, (value?: T | null | undefined) => void)**: Tuple where the first index is the value of the query param and the second one is the function to set a new value to the parameter.
138
+
- **(T | null | undefined, (value?: T | null | undefined) => void)**: Tuple where the first index is the value of the query param and the second one is the function to set a new value to the parameter.
0 commit comments