Skip to content

Commit c67611a

Browse files
committed
Add querystring docs.
1 parent a6ca783 commit c67611a

File tree

4 files changed

+61
-1
lines changed

4 files changed

+61
-1
lines changed

CHANGELOG.md

+15
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,20 @@
11
# CHANGELOG
22

3+
## 0.26.0
4+
- Support querystrings.
5+
* Querystrings are not matched - they are stripped before matching patterns.
6+
* Querystrings, if present, are parsed and passed as the `_query` prop.
7+
* See the [querystring docs](http://strml.viewdocs.io/react-router-component/querystring).
8+
9+
## 0.25.4
10+
- More ES6 fixes.
11+
12+
## 0.25.3
13+
- Hotfix: adjust API for url-pattern to fit ES6 modules.
14+
15+
## 0.25.2
16+
- Allow overriding url-pattern's compiler.
17+
318
## 0.25.1
419
- Remove bad ReactComponent typecheck on Route/Location.
520

README.md

+2-1
Original file line numberDiff line numberDiff line change
@@ -56,7 +56,7 @@ React router component can dispatch based on `location.pathname` or
5656

5757
Furthermore it provides advanced features like support for [regex matching][regex],
5858
[full page server side rendering][server-side], [multiple routers][multiple] on the same page,
59-
[contextual routers][contextual] and support for [async components][async].
59+
[querystring parsing][querystring], [contextual routers][contextual] and support for [async components][async].
6060

6161
Its functionality is tested using [Saucelabs][] on all modern browsers (IE >= 9,
6262
Chrome >= 27, Firefox >= 25, Safari >= 6 and Mobile Safari on iPhone and iPad >=
@@ -81,6 +81,7 @@ See [docs][] for the usage.
8181
[server-side]: http://strml.viewdocs.io/react-router-component/server-side
8282
[multiple]: http://strml.viewdocs.io/react-router-component/multiple
8383
[contextual]: http://strml.viewdocs.io/react-router-component/contextual
84+
[querystring]: http://strml.viewdocs.io/react-router-component/querystring
8485
[a-elements]: http://strml.viewdocs.io/react-router-component/a-elements
8586
[rec-custom-link]: http://strml.viewdocs.io/react-router-component/recipes/custom-link
8687
[rec-custom-router]: http://strml.viewdocs.io/react-router-component/recipes/custom-router

docs/index.md

+2
Original file line numberDiff line numberDiff line change
@@ -46,6 +46,7 @@ React router component can dispatch based on `location.pathname` or
4646

4747
Furthermore it provides advanced features like support for [full page server
4848
side rendering][server-side], [multiple routers][multiple] on the same page,
49+
[querystring parsing][querystring],
4950
[contextual routers][contextual], support for [async components][async] and
5051
[optional handling of normal `<a>` elements][a-elements].
5152

@@ -214,6 +215,7 @@ These are the examples of what you can do with React Router component:
214215
[rec-es6-custom-router]: recipes/rec-es6-custom-router
215216

216217
[hash-routing]: hash-routing
218+
[querystring]: querystring
217219
[server-side]: server-side
218220
[multiple]: multiple
219221
[contextual]: contextual

docs/querystring.md

+42
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,42 @@
1+
# Querystring parsing
2+
3+
React-router-component, as of 0.26.0, understands querystrings.
4+
5+
Querystrings are not matched as part of a route. It is not possible to switch routes
6+
based on a querystring.
7+
8+
The route `/foo/:bar` will match both `/foo/biff` and `/foo/baz?biff=baz&num=1`.
9+
10+
For example:
11+
12+
var App = React.createClass({
13+
14+
render: function() {
15+
return (<Locations path={this.props.path)}
16+
onBeforeNavigation={this.showProgressBar}
17+
onNavigation={this.hideProgressBar}>
18+
<Location path="/foo/:bar" handler={QueryPage} />
19+
</Locations>
20+
);
21+
}
22+
});
23+
24+
var QueryPage = React.createClass({
25+
propTypes: {
26+
bar: React.PropTypes.string,
27+
_query: React.PropTypes.object
28+
},
29+
30+
render: function() {
31+
return (
32+
<div>
33+
Hello, this is main page of the application!
34+
This component was passed the values:
35+
Foo: <b>{this.props.foo}</b>
36+
Query: <b>{JSON.stringify(this.props._query)}</b>
37+
</div>
38+
)
39+
}
40+
})
41+
42+
React.render(<App path="/foo/bar?baz=biff&num=1&react=isAwesome");

0 commit comments

Comments
 (0)