javascript - NavLink 在 reactjs 中显示默认组件

Question

            <div className="menubutton">
              <NavLink exact to="/assigned"><button>Assigned</button></NavLink>
              <NavLink to="/picked"><button>Picked</button></NavLink>
              <NavLink to="/completed"><button>Completed</button></NavLink>
            </div>
            <Switch>
              <Route exact path='/assigned' component={ () =><AssignedComponent  />} />
              <Route exact path='/picked' component={PickingComponent} />
              <Route exact path='/completed' component={CompletedComponent} />
            </Switch>
          </div>

      </BrowserRouter>

如何在页面上显示分配的组件进入。单击分配按钮后我得到了。但是我需要在页面上进入请帮助我

Answer 1

可以在末尾添加一个Redirect，重定向到'/assigned'

  </BrowserRouter>
      <div className="menubutton">
          <NavLink exact to="/assigned"><button>Assigned</button></NavLink>
          <NavLink to="/picked"><button>Picked</button></NavLink>
          <NavLink to="/completed"><button>Completed</button></NavLink>
        </div>
        <Switch>
          <Route exact path='/assigned' component={ () =><AssignedComponent  />} />
          <Route exact path='/picked' component={PickingComponent} />
          <Route exact path='/completed' component={CompletedComponent} />
          <Redirect to"/assigned" />
        </Switch>
      </div>

  </BrowserRouter>