title: React-router4 display the name in component
body: <p>I use react-router4 and try to display the name of the corresponding label in the commented location. I don't know how to solve this problem.
  Does the react-router4 offer a solution to this problem? Can anyone show me how to do it? </p>
  
  <p>Navigation.js:</p>
  
  <pre><code>        ...                        
  &lt;NavigationButton to="/" label="Dashboard" exact&gt;
                                  &lt;MenuItem className={classes.menuItem}
                                            selected={this.state.selected === "Dashboard"}
                                            onClick={() =&gt; {this.setState({selected: "Dashboard"})}}&gt;
                                      &lt;ListItemIcon className={classes.icon}&gt;
                                          &lt;Home/&gt;
                                      &lt;/ListItemIcon&gt;
                                      &lt;ListItemText classes={{primary: classes.primary}} inset primary="Dashboard"/&gt;
                                  &lt;/MenuItem&gt;
                              &lt;/NavigationButton&gt;
              &lt;NavigationButton to="/payment" label="Payment" exact&gt;
                          &lt;MenuItem className={classes.menuItem}
                                    selected={this.state.selected === "Payment"}
                                    onClick={() =&gt; {this.setState({selected: "Payment"})}}&gt;
                              &lt;ListItemIcon className={classes.icon}&gt;
                                  &lt;Payment/&gt;
                              &lt;/ListItemIcon&gt;
                              &lt;ListItemText classes={{primary: classes.primary}} inset primary="Moje płatności"/&gt;
                          &lt;/MenuItem&gt;
                      &lt;/NavigationButton&gt;
  
      ...
  </code></pre>
  
  <p>Header:</p>
  
  <pre><code>...
              &lt;div className={classes.root}&gt;
                  &lt;div className={classes.appFrame}&gt;
                      &lt;AppBar
                          className={classNames(classes.appBar, {
                              [classes.appBarShift]: open,
                              [classes[`appBarShift-left`]]: open,
                          })}
                      &gt;
                          &lt;Toolbar disableGutters={!open} className={classes.toolBar}&gt;
                              &lt;IconButton
                                  color="inherit"
                                  aria-label="Open drawer"
                                  onClick={this.handleDrawerToggle}
                                  className={classNames(classes.menuButton, open)}
                              &gt;
                                  &lt;MenuIcon /&gt;
                              &lt;/IconButton&gt;
                              &lt;Typography variant="h6" color="inherit" noWrap&gt;
    {/* print "Dashboard" when I choose Dashboard, or print "Payment" when I choose payment in Navigation.js. */}
                              &lt;/Typography&gt;
                          &lt;/Toolbar&gt;
                      &lt;/AppBar&gt;
                      {before}
                      &lt;main
                          className={classNames(classes.content, classes[`content-left`], {
                              [classes.contentShift]: open,
                              [classes[`contentShift-left`]]: open,
                          })}
                      &gt;
                          &lt;div className={classes.drawerHeader} /&gt;
                          &lt;Switch&gt;
                              &lt;Route exact path="/" component={DashboardComponent} /&gt;
                              &lt;Route exact path="/payment" component={PaymentComponent} /&gt;
                              &lt;Redirect to="/" /&gt;
                          &lt;/Switch&gt;
  
                      &lt;/main&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
  ...
  </code></pre>
  
  <p>I use react-router4 and try to display the name of the corresponding label in the commented location. I don't know how to solve this problem.
  Does the react-router4 offer a solution to this problem? Can anyone show me how to do it? </p>