File tree Expand file tree Collapse file tree 1 file changed +25
-0
lines changed
packages/use-query-params Expand file tree Collapse file tree 1 file changed +25
-0
lines changed Original file line number Diff line number Diff line change @@ -86,3 +86,28 @@ const Component = () => {
86
86
)
87
87
}
88
88
```
89
+
90
+ ### Push onto the stack instead of replacing
91
+
92
+ To avoid mutating history
93
+
94
+ ``` js
95
+ // In this exemple we assume that we have an URL that include : `?company=Scaleway".
96
+ import React from ' react'
97
+ import useQueryParams from ' @scaleway/use-query-params'
98
+
99
+ const Component = () => {
100
+ const { queryParams , setQueryParams } = useQueryParams ()
101
+ const { user , company } = queryParams // user will be undefined and company will be "Scaleway"
102
+ const setUser = () => replaceQueryParams ({ user: ' John' }, { push: true }) // user will be "John" and company will be undefined
103
+ // ?user=John
104
+
105
+ return (
106
+ <>
107
+ < h1> User: {user}< / h1>
108
+ < h1> Company: {company}< / h1>
109
+ < button onClick= {setUser}> Set User John< / button>
110
+ < / >
111
+ )
112
+ }
113
+ ```
You can’t perform that action at this time.
0 commit comments