有人可以告诉我最好的办法吗？我想从我的路线传递一个页面标题道具到我的标题子组件.这是我的路线：
var sampleApp= React.createClass({
render: function (){
return (
<div className="our-schools-app">
<Header />
<RouteHandler />
<Footer />
</div>
);
},});
var routes = (
<Route name="app" path="/" handler={OurSchoolsApp}>
<DefaultRoute name="home" handler={HomePage} />
<Route name="add-school" handler={AddSchoolPage} />
<Route name="calendar" handler={CalendarPage} />
<Route name="calendar-detail" path="calendar-detail/:id" handler={CalendarDetailPage} />
<Route name="info-detail" path="info-detail/:id" handler={InfoDetailPage} />
<Route name="info" handler={InfoPage} />
<Route name="news" handler={NewsListPage} />
<Route name="news-detail" path="news-detail/:id" handler={NewsDetailPage} />
<Route name="contacts" handler={ContactPage} />
<Route name="contact-detail" handler={ContactDetailPage} />
<Route name="settings" handler={SettingsPage} />
</Route>
);
Router.run(routes,function(Handler){
var mountNode = document.getElementById('app');
React.render(<Handler />,mountNode);
});
<Route name="info" handler={InfoPage} pageTitle="Info Page" />
对我的标题组件：
var Header = React.createClass({
render: function () {
return (
<div className="bar bar-header"
style={this.getStyle()}>
<HomeButton />
<div className="h1 title">{this.props.pageTitle}</div>
</div>
)
}
});
但道具显示为空,有人可以帮忙吗？
解决方法
目前您无法使用React Router(1.0)进行此操作.我相信一个推荐的方法是包装纸组件：
var BaseComponent = React.createClass({
render: function() {
return <p>{this.props.text}</p>
}
});
var FancyComponent = React.createClass({
return <BaseComponent text="fancy!" />
});
var EvenFancierComponent = React.createClass({
return <BaseComponent text="SUPER fancy!" />
});
那么这些路线：
<Route name="standard" handler={BaseComponent} />
<Route name="fancy" handler={FancyComponent} />
<Route name="superfancy" handler={EvenFancierComponent} />
不过关于React Router github issues这个话题的讨论提供了一个好消息：
I just wanted to note here that in the new API (see 07001) routes are
just plain objects,so you can put whatever props you want on them.
Your transition hooks will get a route arg and components will receive
this.props.route,so you should be good to go.
它看起来像是新的1.0版本是beta版,所以应该很快来了！
