reactjs - 在路由中传递参数

Question

有没有办法将参数传递给路由？

我有这个 ：

<PrivateRoute path="/testpage" component={TestPage} />

和

const PrivateRoute = ({ path, component }) => {
    const { isAuthenticated } = useContext(AuthContext);

    return isAuthenticated ? (
        <Route path={path} component={component} />
    ) : (
            <Redirect to="/login" />
        );
};

我想做这样的事情（在我的路线中添加 myParameter）：

<PrivateRoute path="/testpage" component={TestPage} myParameter={myParameter} />

谢谢

标签： reactjsreact-routerjsx

Answer 1

将组件名称更改为组件

const PrivateRoute = ({ path, Component, myParameter }) => {
    const { isAuthenticated } = useContext(AuthContext);

    return isAuthenticated ? (
        <Route path={path} render={() => <Component myParameter={myParameter} />} />
    ) : (
            <Redirect to="/login" />
        );
};

如何呈现您的私人路线：

<PrivateRoute path="/testpage" Component={TestPage} myParameter={myParameter} />