React的几种路由配置方法

1.标签(常用)

import { IndexRoute } from 'react-router'

const Dashboard = React.createClass({
  render() {
    return 
Welcome to the app!
} }) React.render(( ), document.body)

IndexRoute相当于是首页的路由配置

  1. 对象
    以对象的形式配置路由,写法如下:
const routeConfig = [
  { path: '/',
    component: App,
    indexRoute: { component: Dashboard },
    childRoutes: [
      { path: 'about', component: About },
      { path: 'inbox',
        component: Inbox,
        childRoutes: [
          { path: '/messages/:id', component: Message }
        ]
      }
    ]
  }
]

React.render(, document.body)
  1. 按需加载
    在一个很大大项目中,我们一开始可能并不需要用到那么多的功能,只需要部分,如点击一个按钮出现一个功能界面。我们可以不必在载入界面的时候就加载所有的js,可以在点击那个按钮时再加载对应js。这样我们需要对自己的代码进行拆分。

你可能感兴趣的