m-lamonaca/dev-notes
1
0
Fork 0
mirror of https://github.com/m-lamonaca/dev-notes.git synced 2025-04-08 11:56:41 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions

Typo fixes

Browse source
This commit is contained in:
Marcello Lamonaca 2021-03-25 18:46:56 +01:00
parent 990709787c
commit a97fd80966
1 changed files with 17 additions and 17 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

34
JavaScript/React/React Router.md
View file

@ -46,24 +46,10 @@ import { Route, Switch } from "react-router-dom";
<Switch> <Switch>
<Route path="/" exact component={Component} /> <Route path="/" exact component={Component} />
<Route path="/route" component={Component} /> <Route path="/route" component={Component} />
<Route component={PageNotFound} /> {/* mathes all non-existent URLs */} <Route component={PageNotFound} /> {/* matches all non-existent URLs */}
</Switch> </Switch>
``` ```
### Redirectin
```js
import { Redirect } from "react-router-dom";
// redirects to another URL, should'nt be rendered on component mount but after an action
<Redirect to="/route" />
<Redirect from="/old-route" to="/new-route" />
{ condition && <Redirect to="/route" /> } // redirect if condition is true
// or redirect manipolating the history (alwais in props)
props.history.push("/new-route");
```
### URL Parameters & Query String ### URL Parameters & Query String
```js ```js
@ -78,12 +64,26 @@ function Component(props) {
} }
``` ```
### Propts ### Redirecting
```js
import { Redirect } from "react-router-dom";
// redirects to another URL, should'nt be rendered on component mount but after an action
<Redirect to="/route" />
<Redirect from="/old-route" to="/new-route" />
{ condition && <Redirect to="/route" /> } // redirect if condition is true
// or redirect manipolating the history (always in props)
props.history.push("/new-route");
```
### Prompts
```js ```js
import { Prompt } from "react-router-dom"; import { Prompt } from "react-router-dom";
// displayes a prompt when the conditioni true // displayes a prompt when the condition is true
<Prompt when={condition} message="prompt message" /> <Prompt when={condition} message="prompt message" />
``` ```