title: how to change image src using props with styled component and react
body: <p>I want to reuse my component for multiple pages.
  so, I have to change img src in styled.img component as passing props.</p>
  
  <p>is it possible to change image src on styled component ? </p>
  
  <p>I applied my code like below.
  it's not working..</p>
  
  <pre><code>//logic
  
  import Myimg from './img/icon_my';
  
  const OngoingLists = ({ ...props }) =&gt; {
    return (
      &lt;ListsOutWrap&gt;
        &lt;ProgramListWrap {...props}&gt;
          &lt;IconWrap {...props} &gt;
            &lt;MyIcon {...props} /&gt;
          &lt;/IconWrap&gt;
        &lt;/&lt;ProgramListWrap&gt;
      &lt;/ListsOutWrap&gt;
    );
  }
  
  
  // styled component 
  const MyIcon = styled.img.attrs({
    src: props =&gt; props.Img || { Myimg },
  })`
    width: 100%;
  `;
  
  </code></pre>
  
  <p>I tried like above, any image doesn't show...even default img file doesn't show..
  how can I change src file by using props ?? 
  should I use background-image ? </p>
  
  <p>thanks for ur help in advance ! :) </p>