我正在努力学习React。该样本项目被设计为与React 0.13.3和react-router 0.13.3一起使用。我正在使用react 15.4.1和react-router 3.0.0
该示例项目在允许用户导航到页面之前,将使用willTransitionTo进行简单的确认。这是代码:
var About = React.createClass({
statics: {
willTransitionTo: function(transition, params, query, callback) {
if (!confirm('Are you sure you want to read a page that\'s this boring?')) {
transition.about();
} else {
callback();
}
}, ...
我知道在我使用的react-router版本中,以上内容不再起作用。因此,按照在react router文档页面上找到的auth-flow示例,我将代码转换为使用onEnter约定。到目前为止,这是我所拥有的:
function confirmTransition(nextState, replace){
if(comfirm('Are you sure you want to read a page that\'s this boring?')){
replace({
pathname: '/about',
state: {nextPathname: nextState.location.pathname}
});
}
}
ReactDOM.render((
<Router history={hashHistory}>
<Route path="/" component={require('./components/app')}>
<IndexRoute component={require('./components/homePage')} />
<Route path="/authors" component={require('./components/authors/authorPage')} />
<Route path="/about" component={require('./components/about/aboutPage')} />
<Redirect from="about-us" to="about" />
<Route path='*' component={require('./components/notFoundPage')} onEnter={confirmTransition}/>
</Route>
</Router>
), document.getElementById('app'));
我遇到的问题是,当我尝试导航到“关于”页面时,onEnter不会触发。
我确定我想念一些东西。我可能做错了什么?
好的。我...不聪明。我发现我将onEnter放置在错误的路线上。
谢谢大家没有指出这一点。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句