Skip to content

Commit 348947e

Browse files
committed
Update troubleshooting guide
1 parent 49d5bff commit 348947e

File tree

3 files changed

+38
-11
lines changed

3 files changed

+38
-11
lines changed

README.md

Lines changed: 5 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -9,11 +9,12 @@ React Router keeps your UI in sync with the URL. It has a simple API with powerf
99

1010
### Docs & Help
1111

12-
- [Tutorial - Do This First!](https://github.com/reactjs/react-router-tutorial)
13-
- [Guides and API Docs](https://github.com/reactjs/react-router/tree/master/docs)
14-
- [Change Log](/CHANGES.md)
12+
- [Tutorial – do this first!](https://github.com/reactjs/react-router-tutorial)
13+
- [Guides and API docs](https://github.com/reactjs/react-router/tree/master/docs)
14+
- [Troubleshooting guide](https://github.com/reactjs/react-router/blob/master/docs/Troubleshooting.md)
15+
- [Changelog](/CHANGES.md)
1516
- [Stack Overflow](http://stackoverflow.com/questions/tagged/react-router)
16-
- [Codepen Boilerplate](http://codepen.io/anon/pen/xwQZdy?editors=001)
17+
- [CodePen boilerplate](http://codepen.io/anon/pen/xwQZdy?editors=001)
1718
Please use for bug reports
1819

1920
**Older Versions:**

docs/Troubleshooting.md

Lines changed: 32 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -1,14 +1,17 @@
11
# Troubleshooting
22

33
### `this.context.router` is `undefined`
4-
You will need to add the router context type to your component so the router will be available to you.
4+
5+
You need to add `router` to your component's `contextTypes` to make the router object available to you.
6+
57
```js
68
contextTypes: {
7-
router: React.PropTypes.func.isRequired
9+
router: React.PropTypes.object.isRequired
810
}
911
```
1012

11-
### How to get previous path?
13+
14+
### Getting the previous location
1215

1316
```js
1417
<Route component={App}>
@@ -28,19 +31,42 @@ const App = React.createClass({
2831
```
2932

3033
### Component won't render
31-
Route matching happens in the order they are defined (think `if/elseif` statement). In this case, `/about/me` will show the `UserPage` component because `/about/me` matches the first route. You need to reorder your routes if this happens.
32-
`About` will never be reachable:
34+
35+
Route matching happens in the order they are defined (think `if/elseif` statement). In this case, `/about/me` will show the `<UserPage>` component because `/about/me` matches the first route. You need to reorder your routes if this happens. `<About>` will never be reachable:
36+
3337
```js
3438
<Router>
3539
<Route path="/:userName/:id" component={UserPage}/>
3640
<Route path="/about/me" component={About}/>
3741
</Router>
3842
```
3943

40-
`About` is now be reachable:
44+
`About` is now reachable:
45+
4146
```js
4247
<Router>
4348
<Route path="/about/me" component={About}/>
4449
<Route path="/:userName/:id" component={UserPage}/>
4550
</Router>
4651
```
52+
53+
54+
### "Required prop was not specified" on route components
55+
56+
You might see this if you are using `React.cloneElement` to inject props into route components from their parents. If you see this, remove `isRequired` from `propTypes` for those props. This happens because React validates `propTypes` when the element is created rather than when it is mounted. For more details, see [facebook/react#4494](https://github.com/facebook/react/issues/4494#issuecomment-125068868).
57+
58+
You should generally attempt to use this pattern as sparingly as possible. In general, it's best practice to minimize data dependencies between route components.
59+
60+
61+
### `<noscript>` with server-side rendering and async routes
62+
63+
Use `match({ history, routes })` on the client side. See [the server rendering guide](guides/ServerRendering.md#async-routes).
64+
65+
66+
### Passing additional values into route components
67+
68+
There are multiple ways to do this depending on what you want to do. You can:
69+
70+
- Define additional values on `<Route>` or the plain route. This will make those values available on `this.props.route` on route components.
71+
- Pass in a `createElement` handler to `<Router>` or `<RouterContext>`. This will allow you to inject additional props into route elements at creation time.
72+
- Define a top-level component above `<Router>` or `<RouterContext>` that exports additional values via `getChildContext`, then access them via context from rendered components.

docs/guides/ServerRendering.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -58,7 +58,7 @@ match({ history, routes }, (error, redirectLocation, renderProps) => {
5858
})
5959
```
6060

61-
## History singletons
61+
## History Singletons
6262

6363
Because the server has no DOM available, the history singletons (`browserHistory` and `hashHistory`) do not function on the server. Instead, they will simply return `undefined`.
6464

0 commit comments

Comments
 (0)