Question

在docs之后，我有这个代码：

var React = require('react');
var Router = require('react-router');
var Route = Router.Route;
var RouteHandler = Router.RouteHandler;
var Link = Router.Link;

var About = React.createClass({
    render: function () {
        return <h2>About</h2>;
    }
});

var Inbox = React.createClass({
    render: function () {
        return <h2>Inbox</h2>;
    }
});

var Home = React.createClass({
    render: function () {
        return <h2>Home</h2>;
    }
});

var Message = React.createClass({
    componentDidMount: function () {
        // from the path `/inbox/messages/:id`
        var id = this.props.params.id;
        console.log('id',id);
    },
    render () {
        return (
            <div>
                <h1>Message  {this.props.params.id}</h1>
            </div>
        );
    }
});

var App = React.createClass({
    render () {
        return (
            <div>
                <h1>App</h1>
                <ul>
                    <li><Link to="/">Home</Link></li>
                    <li><Link to="about">About</Link></li>
                    <li><Link to="inbox">Inbox</Link></li>
                    <li><Link to="message" params={ {id: 'myid'} }>Inbox message</Link></li>
                </ul>
                <RouteHandler {...this.props}/>
            </div>
        );
    }
});

// declare our routes and their hierarchy
var routes = (
    <Route handler={App}>
        <Route name="home" path="/" handler={Home}/>
        <Route name="about" path="/about" handler={About}/>
        <Route name="inbox" path="/inbox" handler={Inbox}>
            <Route name="message" path="/messages/:id" handler={Message}/>
        </Route>
    </Route>
);

Router.run(routes, Router.HashLocation, (Root, state) => {
    var params = state.params;
    React.render(<Root  params={params} />, document.body);
});

我想知道为什么我点击在框中消息链接我看到了收件箱而非邮件

出了什么问题？

Answer 1

如果用<DefaultRoute handler={Message} />?

替换邮件路由会发生什么

Answer 2

这是什么版本的反应路由器？在1.0版之前（可能仍然在1.0中工作），您可以像这样传递params：

<Link to="message" params={ {id: myid} }>In box message</Link>

反应路由器不显示嵌套路由

2 个答案: