使用react js_导航到按钮单击上的全新页面，下一页没有路由按钮

Question

我一直在尝试使用Route / BrowserHistory从一个页面导航到另一页面，但是他们所做的是，路由器按钮位于页面顶部。但是，我想导航到一个完全不同的页面，其中不包含该路由按钮。

例如，在我的情况下，我的第一页包含两个按钮Configuration和User Portal。单击任何按钮后，我想跳到新页面，即单击User Portal的UserPortal页面。

这是我的代码：

<div className="App">
   <BrowserRouter>
      <div>
        <nav aria-label="breadcrumb">
          <ol className="breadcrumb" style={{background: 'none'}}>
             <div className="breadcrumb-item">
                <Link to="configuration">
                  <button className='btn btn-primary' id='config' >Configuration</button>
                </Link>
             </div>
             <div className="breadcrumb-item">
                <Link to="userPortal">
                  <button className='btn btn-primary' id='portal' >User Portal</button>
                </Link>
             </div>
          </ol>
        </nav>
        <Switch>
           <Route path="/configuration" component={ArduinoInterface} />
           <Route path="/userPortal" component={UserPortal} />
        </Switch>
     </div>
  </BrowserRouter>
</div>
我该怎么做才能获得理想的结果？ 

您的帮助将不胜感激！谢谢。

我一直在尝试使用Route / BrowserHistory从一个页面导航到另一页面，但是它们的作用是路由器按钮位于页面顶部。但是，我想导航到一个完全...

Answer 1

这就是我解决问题的方式。我遵循了this example，它起作用了。