React: Route URL
Ankommende URL über Webrequest.URL
dieURL Pfade werden in der App.js im render() Block eingetragen
<Route exact path='/' component={Home} /> <Route path='/counter' component={Counter} /> <Route path='/shoppinglist' component={Shoppinglist} /> <AuthorizeRoute path='/fetch-data' component={FetchData} /> <Route path={ApplicationPaths.ApiAuthorizationPrefix} component={ApiAuthorizationRoutes} />
|
Route als Link erzeugen:
ActiveRoute, abgehende URL
In der Componente: Navbar wird der Pfad über <NavLink to="/subpage" >Menuitem eingetragen
<Navbar className="navbar-expand-sm navbar-toggleable-sm ng-white border-bottom box-shadow mb-3" light> <Container> <NavbarBrand tag={Link} to="/">React01</NavbarBrand> <NavbarToggler onClick={this.toggleNavbar} className="mr-2" /> <Collapse className="d-sm-inline-flex flex-sm-row-reverse" isOpen={!this.state.collapsed} navbar> <ul className="navbar-nav flex-grow"> <NavItem> <NavLink tag={Link} className="text-dark" to="/shoppinglist">Shoppinglist</NavLink> </NavItem> <NavItem> <NavLink tag={Link} className="text-dark" to="/">Home</NavLink> </NavItem> <NavItem> <NavLink tag={Link} className="text-dark" to="/counter">Counter</NavLink> </NavItem> <NavItem> <NavLink tag={Link} className="text-dark" to="/fetch-data">Fetch data</NavLink> </NavItem> <LoginMenu> </LoginMenu> </ul> </Collapse> </Container> </Navbar>
|