想要在反应路由路由器中传递多个组件

如何解决想要在反应路由路由器中传递多个组件

想在反应路由方法中传递多个组件

公共页面用于管理员和普通用户。

我想要一个正确的方法来传递路由中的多个组件

我已经这样做了，但它不是一个正确的方法。请看看你可能会找到解决方案..

import { Router,Route } from 'react-router-dom';
import { connect } from 'react-redux';

import { history } from '../_helpers';
import { alertActions } from '../_actions';
import { PrivateRoute } from '../_components';
import { HomePage } from '../HomePage';
import { HomePageAdmin } from '../HomePage/HomePageAdmin';
import { CommonPage } from '../HomePage/CommonPage';
import { LoginPage } from '../LoginPage';
//import {WelcomePage} from "../WelcomePage"

class App extends React.Component {
    constructor(props) {
        super(props);

        const { dispatch } = this.props;
        history.listen((location,action) => {
            // clear alert on location change
            dispatch(alertActions.clear());
        });
    }

    render() {
        const { alert } = this.props;
        return (
           <div className="jumbotron">
                <div className="container">
                    <div className="col-sm-8 col-sm-offset-2">
                        {alert.message &&
                            <div className={`alert ${alert.type}`}>{alert.message}</div>
                        }
                        <Router history={history}>
                            <div>
                                 <Route exact path="/" component={LoginPage} />
                                <PrivateRoute exact path="/Home" component={HomePage} />
                                <PrivateRoute exact path="/Home" component={CommonPage} />
                                <PrivateRoute path="/HomePageAdmin" component={HomePageAdmin} />
                                <PrivateRoute path="/HomePageAdmin" component={CommonPage} />
                                <Route exact path="/login" component={LoginPage} />
                            </div>
                        </Router>
                    </div>
                </div>
            </div>
        );
    }
}

function mapStatetoProps(state) {
    const { alert } = state;
    return {
        alert
    };
}

const connectedApp = connect(mapStatetoProps)(App);
export { connectedApp as App }; ```