webappengine
Version:
A web application platform that can host multiple web apps running with Node.js.
80 lines (55 loc) • 1.7 kB
Markdown
A mixin for components that need to create URLs and/or initiate
transitions to other routes.
Instance Methods
----------------
### `transitionTo(routeNameOrPath, [params[, query]])`
Programmatically transition to a new route.
#### Examples
```js
this.transitionTo('user', {id: 10}, {showAge: true});
this.transitionTo('about');
this.transitionTo('/users/10?showAge=true');
this.transitionTo('http://example.com/users/10?showAge=true');
```
### `replaceWith(routeNameOrPath, [params[, query]])`
Programmatically replace current route with a new route. Does not add an
entry into the browser history.
#### Examples
```js
this.replaceWith('user', {id: 10}, {showAge: true});
this.replaceWith('about');
this.replaceWith('/users/10?showAge=true');
```
### `goBack()`
Programmatically go back to the last route and remove the most recent
entry from the browser history.
#### Example
```js
this.goBack();
```
### `makePath(routeName, params, query)`
Creates a URL path to a route.
### `makeHref(routeName, params, query)`
Creates an `href` to a route. Use this along with `State` when you
need to build components similar to `Link`.
#### Example
```js
// given a route like this:
// <Route name="user" path="users/:userId"/>
this.makeHref('user', {userId: 123}); // "users/123"
```
Example
-------
```js
var Navigation = require('react-router').Navigation;
React.createClass({
mixins: [Navigation],
render: function() {
return (
<div onClick={() => this.transitionTo('foo')}>Go to foo</div>
<div onClick={() => this.replaceWith('bar')}>Go to bar without creating a new history entry</div>
<div onClick={() => this.goBack()}>Go back</div>
);
}
});
```