Reactjs 侧栏的反应路由器dom配置

Reactjs 侧栏的反应路由器dom配置,reactjs,react-redux,react-router,react-boilerplate,Reactjs,React Redux,React Router,React Boilerplate,我正在基于创建应用程序,然后为主页添加仪表板模板。假设我有4页: 登录 主页 使用者 未找到页面 我的路线代码是: return ( <div> <Switch> <Route exact path="/Login" component={LoginPage} /> <Sigma> <Route exact path="/Home" c

我正在基于创建应用程序,然后为主页添加仪表板模板。假设我有4页:

  • 登录
  • 主页
  • 使用者
  • 未找到页面
我的路线代码是:

return (
    <div>
        <Switch>
            <Route exact path="/Login" component={LoginPage} />
            <Sigma>
                <Route exact path="/Home" component={HomePage} />
                <Route exact path="/User" component={UserPage} />
                <Route exact path="/EditUser" component={EditUserPage} />
            </Sigma>
            <Route component={NotFoundPage} />
        </Switch>
    </div>
);
返回(
);
对于登录名、主页和用户,它已经如我所期望的那样显示出来了。登录页面将不显示侧边栏,然后主页和用户将显示侧边栏。但是对于“未找到”页面,它并没有像我预期的那样显示。我希望它在没有侧边栏的情况下显示

登录页面:

主页:

用户:

未找到页面:


请抛出一些与此问题相关的指针/文档。谢谢你。来源:

在这种情况下,在加载路由并在基本组件中输入路由组件之后,需要更改index.js以呈现“基本组件”

在这个基本组件中,您可以在应用程序中使用边栏

例如:

**



**

在这种情况下,在加载路由并在基本组件中输入路由组件后,需要更改index.js以呈现“基本组件”

在这个基本组件中,您可以在应用程序中使用边栏

例如:

**


**

<Switch>
<Route path="/" exact component={Login} />
<Route path="/register" component={Register} />
<Route path="/dashboard"><Base><Dashboard /></Base></Route>
<Route component={FourHundredFour} />
</Switch>