传递自定义参数反应路由器的OnEnter功能

平时对输入功能反应路由器的路由看起来有点simmilar这样：传递自定义参数反应路由器的OnEnter功能

const isLoggedIn = (nextState, replace, callback) => { 
    /* Some checks/redirects here */ 
}

，我们使用它的路线，像这样

<Route onEnter={isLoggedIn} />

我试图通过一个自定义参数，但没有运气，基本上我想达到这样的东西

<Route onEnter={isLoggedIn(myParam)} />

并能够访问它的功能，所以

const isLoggedIn = (myParam, nextState, replace, callback) => { 
    /* Some checks/redirects here */ 
}

来源

2016-09-07 Ilja

为此，您可以使用上下文结合。当您从React路由器中调用该函数时，只需绑定您在auth函数中需要的数据。您也可以通过这种方式传递对象。你的代码是这样：

function requireAuth(nextState, replace) { 
 
    console.log(this.loggedIn) 
 
} 
 

 
<Route onEnter={requireAuth.bind({"loggeIn":this.props.loggedIn})} />

另一种选择是使用函数的参数，如果你使用的ECMAScript 6：

var requireAuth=(loggedIn)=>{ 
 
    return (nextState,replace)=>{ 
 
    console.log(loggedIn) 
 
    } 
 
} 
 

 
<Route onEnter={requireAuth(this.props.loggedIn)} />

它应该工作更短：

var requireAuth=(loggedIn)=>(nextState,replace)=>{ 
 
    console.log(loggedIn) 
 
} 
 

 
<Route onEnter={requireAuth(this.props.loggedIn)} />

来源

2016-09-10 22:17:26 user2080851

您不能更改ReactJS 提供如语法阵营中提到，我们必须使用这

的OnEnter文件（nextState，更换，回调？）

当即将输入路线时调用。它提供下一个路由器状态和一个重定向到另一个路径的功能。这将是触发挂钩的路由实例。

如果回调被列为第三个参数，该钩子将异步运行，并且转移将阻塞，直到调用回调。

PFA参考：https://github.com/reactjs/react-router/blob/master/docs/API.md#onenternextstate-replace-callback

来源

2016-09-07 11:07:20

传递自定义参数反应路由器的OnEnter功能

回答

相关问题