title: React Router 4 Regex paths - match doesn't find parameters
body: <p>I'm trying to have regex pattern matching for react router 4, but unfortunately the <strong><code>this.props.match.params.id</code> is not parsing the path correctly, and shows up as undefined.</strong></p>
  
  <p>Examples of paths i want to be able to access:</p>
  
  <ol>
  <li>/gps</li>
  <li>/gps/air</li>
  <li>/gps/a0b6dc45-11a1-42c5-afdb-a62822d109dc</li>
  <li>/gps/air/a0b6dc45-11a1-42c5-afdb-a62822d109dc</li>
  </ol>
  
  <p>My component:</p>
  
  <pre><code>import React from "react";
  import PropTypes from "prop-types";
  import { withRouter, } from "react-router";
  import { Switch, Route } from "react-router-dom";
  
  class Foo extends React.Component {
      render(){
          console.log(this.props.match);
          return &lt;div&gt;Match: {this.props.match.params.id}&lt;/div&gt;
      }
  } 
  
  const industryRegex = "(air|motor|ship)";
  const guidRegex = "([0-9a-f]{8}-[0-9a-f]{4}-[1-5][0-9a-f]{3}-[89ab][0-9a-f]{3}-[0-9a-f]{12})?"; // Note the questionmark ? at the end
  
  const pathId =            `/gps/:id${guidRegex}`;
  const pathIndustry =      `/gps/:industryType${industryRegex}`;
  const pathIndustryAndId = `/gps/:industryType${industryRegex}/:id${guidRegex}`;
  
  console.log(pathId);
  console.log(pathIndustry);
  console.log(pathIndustryAndId);
  
  const AppComponent = ({...props}) =&gt; {
      return (
          &lt;Switch&gt;
              &lt;Route path={pathId}                     component={Foo} /&gt;
              &lt;Route path={pathIndustry}               component={Foo} /&gt;
              &lt;Route path={pathIndustryAndId}          component={Foo} /&gt;
          &lt;/Switch&gt;
      )
  };
  
  export default withRouter(AppComponent);
  </code></pre>
  
  <p>Trying the following path <code>/gps/a0b6dc45-11a1-42c5-afdb-a62822d109dc</code> results in <code>this.props.match.params.id</code> being undefined.</p>
  
  <p>Any help much appreciated</p>