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 上的问题。
我刚刚离开了 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 上的问题。