React-router 简单使用

Route Configuration

路由配置就是一组基本指令，告诉路由如何尝试匹配URL和代码运行时做什么。下面是一个最基本的简单配置

import React from 'react'
import { render } from 'react-dom'
import { Router, Route, Link } from 'react-router'

const App = React.createClass({
  render() {
    return (
      

        
App
        

          
About
          
Inbox
        
        {this.props.children}
      
    )
  }
})

const About = React.createClass({
  render() {
    return 
About
  }
})

const Inbox = React.createClass({
  render() {
    return (
      

        
Inbox
        {this.props.children || "Welcome to your Inbox"}
      
    )
  }
})

const Message = React.createClass({
  render() {
    return 
Message {this.props.params.id}
  }
})

render((
  
    
      
      
        
      
    
  
), document.body)

这个示例知道如下呈现url

URL	Components
/	App
/about	App -> About
/inbox	App -> Inbox
/inbox/messages/:id	App ->Inbox ->Message