title: How can i pass URL parameter to react js widget
body: <p>I have a react widget fetching data from an API (ex : <code>https://api.prime.com/v1/business/rating/${id}</code>)</p>
  
  <p>In this example a list of informations with the <code>${id}</code> is rendered.</p>
  
  <p>What I would like to do now is to get the ID via the scripts's url parameter :</p>
  
  <p><code>&lt;script src="https://fr.prime.com/rating-widget/merchantidentifier"&gt;&lt;/script&gt;</code> </p>
  
  <p>for example in the code below <code>7182</code> is the <code>merchantidentifier</code>.</p>
  
  <p>The <code>merchantidentifier</code> is variable, in this example <code>7182</code> goes in the <code>reactDOM.render()</code></p>
  
  <p>To show the widget on the merchant websites we need to add the script tag, in this example <code>&lt;script src="https://fr.prime.com/rating-widget/7182"&gt;&lt;/script&gt;</code></p>
  
  <p>How can I pass the <code>merchantidentifier</code> from the URL to the react app</p>
  
  <pre><code>var React = require('react');
  import axios from 'axios';
  import '../node_modules/cleanslate/cleanslate.css';
  import './style.scss';
  
  class Widget extends React.Component {
  
      constructor(props){
          super(props);
          this.state = {}
      }
  
      componentDidMount() {
          let id = this.props.id;
          axios.get(`https://api.prime.com/v1/business/rating/${id}`)
          .then((res) =&gt; {
              const brand = res.data;
              this.setState({
                  rating: brand.rating,
                  logo : brand.logo,
                  name: brand.name,
                  stars: brand.stars,
                  url: brand.url
              });
          });
      }
  
      render() {
          return (
              &lt;div className="cleanslate"&gt;
                  &lt;a href={this.state.url} target="_blank"&gt;
                      &lt;img src="https://fr.prime.com/img.svg" alt="" /&gt;
                      &lt;div className="rating-box"&gt;
                          &lt;img src={this.state.logo} className="the-logo" alt={this.state.name} /&gt;
                          &lt;span className="the-note"&gt;{this.state.rating}/10&lt;/span&gt;
                          &lt;div id="Star" className={`stars-${this.state.stars}`}&gt;&lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/a&gt;
              &lt;/div&gt;
          )
      }
  }
  
  ReactDOM.render(     
    &lt;Widget id="7182" /&gt;,
    document.getElementById('root')        
  );
  </code></pre>