title: http://localhost:3000/[object%20Object] not found 404
body: <p>In my react app, this is an array of filenames I get from server side</p>
  
  <pre><code>const photos = ["01-1913.JPG", "01-1913.1.jpg", "01-1913.2.jpg"]
  </code></pre>
  
  <p>and here is how I use it with JSX</p>
  
  <pre><code>            {
                photos.map(entry =&gt; {
                  return (
                  &lt;div key={entry}&gt;
                  &lt;PhotoItem key={entry} url={`${process.env.REACT_APP_NODE_SERVER}/${entry}`} /&gt;
                  &lt;/div&gt;
                  )
                  })
              }
  </code></pre>
  
  <pre><code>const PhotoItem = (url) =&gt; {
    return (
      &lt;img
        src={url}
        onError={this.addDefaultSrc}
        alt="photoItem"
        style={{
          width: "500px",
          height: "600px",
          border: "1px solid #123C69",
        }}
      &gt;&lt;/img&gt;
    );
  };
  ```
  </code></pre>
  
  <p>I can not figure out why I am not getting the photo (only the dummy photo from the onError event I've used) and if it has anything to do with the Object%object error. Any help would be appreciated.</p>