title: React passing import name as prop and adding to image src
body: <p>I have a react component which has a prop passed with the name of an Import which contains an image path.</p>
  
  <p>In this case the prop value is <strong>Ico1</strong>.</p>
  
  <p>I need to pass the prop in the img src like so:</p>
  
  <p>code below:</p>
  
  <pre><code>import React from 'react';
  import Ico1 from '../icon1.png';
  
  
   const MyComp = (props) =&gt; &lt;div&gt;
  
             &lt;img src={props.chosenicon} alt="" /&gt;
  
           &lt;/div&gt; 
       }
  
   &lt;/div&gt;
  
   export default MyComp
  </code></pre>
  
  <p>My problem is that when I add this:</p>
  
  <pre><code>&lt;img src={Ico1} alt="" /&gt;
  </code></pre>
  
  <p>...it shows the image but if I do this:</p>
  
  <pre><code>&lt;img src={props.chosenicon} alt="" /&gt;
  </code></pre>
  
  <p>...it shows no image, even though the value of <code>props.chosenicon</code> is '<code>Ico1</code>' and typeof says they are both strings.</p>
  
  <p>How can I get this to work so it shows the image?</p>