路由处理ReactJS和react路由器dom v4中特定于用户的唯一生成的URL

http://localhost:8000/auth/security_questions/0e51706361e7a74a550e995b415409fdab4c66f0d201c25cb4fa578959d11ffa

所有这些都很好,但我正试图找出如何使用 React 和 react-router-dom v4 . 我走了这条路。

<Route exact path='/auth/security_questions/:key' component={SecurityQuestions} />

security_questions/ .

它应该做的是匹配 :key 在数据库加载组件之前。

1) 如何解析出 部分,以便我可以将其作为值传递给数据库进行验证。

2) 虽然我对如何处理验证有一个大致的想法,但我不知道该怎么说 反应

我认为它通常看起来像:

// ./containers/security_questions.js

componentWillMount() {
    this.props.verifyKey(:key);
}

然后行动:

// ./actions/authentication.index.js

export function verifyKey({ :key }) {
    return function(dispatch) {
        axios
            .post(
                `${ROOT_URL}/api/auth/security_questions/`, 
                { :key }
            )
            .then(response => {

                dispatch('Finish loading the rest of the component')
            })
            .catch(error => {
                dispatch(authError(error.response.data.non_field_errors[0]));
            });
    }
}