reactjs - 反应路由器无法使用路径参数导航

Question

我在使用路径参数导航反应路由器时遇到问题

这是我的设置

render() {
    return (
        <Switch>
            <Route path={Routes.PASSWORD_RECOVERY} component={ForgotPasswordView}/>
            <Route path={Routes.VERIFY_EMAIL} component={VerifyEmailView}/>
            <Route path={Routes.LOGIN} component={LoginView}/>
            <Route path={Routes.SIGN_UP} component={SignUpView}/>
            <Route path={Routes.VERIFY_RESULTS} component={VerifyGames}/>
            <Route path={Routes.HOME} component={Home}/>
            <Route path={Routes.WELCOME} component={Welcome}/>
            <Route exact path={Routes.DEFAULT} component={DefaultHome}/>
            <Route component={DefaultHome}/>
        </Switch>
    );
}

这是我的路线

static readonly SIGN_UP = "/signup";
static readonly LOGIN = "/login";
static readonly PASSWORD_RECOVERY = "/password_recovery";
static readonly VERIFY_EMAIL = "/verify_email";
static readonly HOME = "/home";
static readonly WELCOME = "/welcome";
static readonly VERIFY_RESULTS = "/verifier";
static readonly DEFAULT = "/";

现在，我希望能够导航到路径路径上的验证游戏组件/verifier。

如果我导航到/verifier它可以工作，但如果我附加路径参数它不会导航。

所以，/verifer工作，但/verifier?name=mekings&&age=25失败并总是重新路由回 DefaultHome 组件

为什么？

标签： reactjsreact-router-domreact-router-v4

Answer 1

您是否尝试过将您的组件用作子组件而不是组件道具？

例如：

<Switch>
<Route path={Routes.SIGN_UP}>
<Login view/>
</Route>
</Switch>

Please share your code on code sandbox if you still have issues.