React-redux-starter-kit: How to define a route without the CoreLayout props children?

Created on 25 Oct 2016  ·  5Comments  ·  Source: davezuko/react-redux-starter-kit

I need a landing page 。
Visit the home page(path = '/') and check no session will redirection to /login
Do not want '/login' is in the CoreLayout under the props, but a complete page.

eg:

<Router> 
    <Route path='/' component="CoreLayout">
    <Route path='/login' component="Login">
</Router>

Most helpful comment

success with

export const createRoutes = (store) => ([
  Login(store)
])

All 5 comments

Hi @onweer,
You should be able to do something like this:

import CoreLayout from '../layouts/CoreLayout/CoreLayout'
import Home from './Home'
import CounterRoute from './Counter'
import Login from './Login'

export const createRoutes = (store) => ([ // now we are passing an array of routes
  {
    path: '/',
    component: CoreLayout,
    indexRoute: Home,
    childRoutes: [
      CounterRoute(store)
    ]
  },
  {
    path: '/login',
    component: Login
  },
  ...
])

...

Don't forget to change routes PropType in AppContainer.js to PropType.array.isRequired

Also, if you want Layout for your Login component, you can follow pattern from the first route.
For example, you could do stuff like this:

...
  {
    path: '/auth',
    component: AuthLayout,
    indexRoute: SignIn,
    childRoutes: [
      SignUpRoute(store), // { path: 'sign-up', ... }
      RecoverPasswordRoute(store), // { path: 'recover-password', ... }
      ...
    ]
  },
...

Hope this helps ;)
Best Regards

@bulicmatko Thanks ;) .

@bulicmatko
how to export the Login Component ?
I use following :

import { injectReducer } from '../../store/reducers'

export default (store) => ({
  path: 'login',
  getComponent (nextState, cb) {
    require.ensure([], (require) => {
      const Login = require('./containers/LoginContainer').default
      const reducer = require('./modules/login').default
      injectReducer(store, { key: 'login', reducer }) // 这个key和components里面拿到的key是同一个key
      cb(null, Login)
    })
  }
})

throw Errors:

Invariant Violation: Component(...): A valid React element (or null) must be returned. You may have returned undefined, an array or some other invalid object.

Or how can i connect Login to store?

success with

export const createRoutes = (store) => ([
  Login(store)
])

@onweer
Glad it helped ;)
Can maybe this issue be closed?

Was this page helpful?
0 / 5 - 0 ratings

Related issues

marcelloromanelli picture marcelloromanelli  ·  5Comments

zeroc picture zeroc  ·  4Comments

orielz picture orielz  ·  3Comments

gilesbradshaw picture gilesbradshaw  ·  5Comments

renanvalentin picture renanvalentin  ·  5Comments