react-router Router.HistoryLocation 离开目标 <noscript> 但没有完美的工作

react-router Router.HistoryLocation leaves target with <noscript> but without works perfectly

我刚刚离开了 ReactJs 的起点并发现了 react-router。很棒的东西,但我看不到以下代码与 "Router.HistoryLocation" 作为 运行 函数的第二个参数一起工作。

即使不在 url 中使用 #,也能完美运行。 This Q got me to Router.HistoryLocation as the 2nd param, so do the github docs。但是每当我在浏览器中 运行 this 时,结果就是目标只填充了这个:

<noscript data-reactid=".0"></noscript>

这是 jsbin 上的代码 运行ning:http://jsbin.com/saxutulaxi/1/. 如果您编辑代码并从最后一个中删除 "Router.HistoryLocation"位一切正常,但没有。

这是我正在 运行ning 的简单脚本。 // 这是直接来自 react-router 文档中的 overview.md var Router = ReactRouter; var DefaultRoute = Router.DefaultRoute; var Link = Router.Link; var 路线 = Router.Route; var RouteHandler = Router.RouteHandler;

var App = React.createClass({
    render: function () {
        return (
        <div>
            <header>
                <ul>
                    <li><Link to="inbox">Inbox</Link></li>
                    <li><Link to="calendar">Calendar</Link></li>
                </ul>
            </header>

            {/* this is the important part */}
            <RouteHandler/>
        </div>
        );
    }
});

var Inbox = React.createClass({
    render: function () {
        return (
            <div>
                This is the inbox
            </div>
        );
    }
});

var Calendar = React.createClass({
    render: function(){
        return (
            <div>
                This is the calendar
            </div>
        );
    }
});

var routes = (
    <Route name="app" path="/" handler={App}>
        <Route name="inbox" handler={Inbox}/>
        <Route name="calendar" handler={Calendar}/>
        <DefaultRoute handler={Inbox}/>
    </Route>
);

Router.run(routes, Router.HistoryLocation, function (Handler) {
    React.render(
        <Handler/>,
        document.querySelector('#content')
    );
});

不知道还能做什么,除了在这里提问,因为我认为我已经严格按照指南进行操作...

谢谢, 约翰

您的代码是正确的,但是由于应用程序在 iframe 中 运行 而它在 JSBin 上不起作用,其中 url 不是 react-router 所期望的。在 JSBin 的例子中,iframe 报告了 /运行ner 的 HistoryLocation。

<Route name="app" path="/runner" handler={App} > 修复了您在 JSBin 上的问题。