make customizing index route easier; update readme

This commit is contained in:
Sacha Greif 2016-07-24 19:05:21 +09:00
parent 1d1a556fb8
commit 739de3254c
2 changed files with 34 additions and 11 deletions

View file

@ -475,7 +475,9 @@ You can use regular Meteor methods, or [Smart Methods](https://github.com/meteor
## Routes
Here's how you can add routes to your app (using React Router):
### Customizing Routes
Here's how you can add child routes to your app (using React Router):
```js
Telescope.routes.add({
@ -485,6 +487,35 @@ Telescope.routes.add({
});
```
To change the index (`/`) route, you can do:
```js
Telescope.routes.indexRoute = {
name: "myIndexRoute",
component: myIndexRouteComponent
};
```
For more complex router customizations, you can also disable the `nova:base-routes` package altogether and replace it with your own React Router code.
### Using React Router In Your Components
If you need to access router properties (such as the current route, path, or query parameters) inside a component, you'll need to wrap that component with the `withRouter` HoC (higher-order component):
```js
import React, { PropTypes, Component } from 'react';
import { withRouter } from 'react-router'
class SearchForm extends Component{
render() {
// this.props.router is accessible
}
}
export default withRouter(SearchForm);
```
## Groups & Permissions
User groups let you give your users permission to perform specific actions.

View file

@ -9,19 +9,11 @@ import createBrowserHistory from 'history/lib/createBrowserHistory';
import Events from "meteor/nova:events";
import Helmet from 'react-helmet';
// // ------------------------------------- Other -------------------------------- //
// FlowRouter.notFound = {
// action() {
// ({App, Error404} = Telescope.components);
// mount(App, {content: <Error404/>});
// }
// };
Telescope.routes.indexRoute = { name: "posts.list", component: Telescope.components.PostsHome };
Meteor.startup(() => {
Telescope.routes.add([
{name:"posts.daily", path:"daily", component:Telescope.components.PostsDaily},
{name:"posts.single", path:"posts/:_id(/:slug)", component:Telescope.components.PostsSingle},
{name:"users.single", path:"users/:slug", component:Telescope.components.UsersSingle},
{name:"users.account", path:"account", component:Telescope.components.UsersAccount},
@ -31,7 +23,7 @@ Meteor.startup(() => {
const AppRoutes = {
path: '/',
component: Telescope.components.App,
indexRoute: { name: "posts.list", component: Telescope.components.PostsHome },
indexRoute: Telescope.routes.indexRoute,
childRoutes: Telescope.routes.routes
}