title: Adding an image - ReactJS
body: <p>I have a code using 'array of objects' that showing employees with details. I want to upload their images also. So where do I need to keep images(their path) in my ReactApp or I can upload from laptop's hard drive directly. What will be the code to upload an image for every single employee.</p>
  <p>Here is my code below:</p>
  <pre><code>import React from &quot;react&quot;;
  
  class App extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
        term: &quot;&quot;,
        names: [
          { name: &quot;Deepak&quot;, age: 25, profile: &quot;Developer&quot; },
          { name: &quot;Deepika&quot;, age: 24, profile: &quot;Designer&quot; },
          { name: &quot;Deepinder&quot;, age: 22, profile: &quot;Tester&quot; }
        ],
        filteredData: [{}]
      };
    }
  
    render() {
      let terms = &quot;&quot;;
      if (this.state.term) {
        terms = this.state.term.toLowerCase();
      }
      return (
        &lt;div className=&quot;App&quot;&gt;
          &lt;label&gt;Search Employee: &lt;/label&gt;
          &lt;input
            type=&quot;text&quot;
            value={this.state.term}
            id=&quot;searchEmp&quot;
            placeholder=&quot;Enter Name&quot;
            onChange={(event) =&gt; {
              if (event.target.value.indexOf(&quot; &quot;) &gt; -1) {
                alert(&quot;Please don\'t enter space.&quot;);
                this.setState({ term: &quot;&quot; });
                return;
              }
              this.setState({ term: event.target.value });
            }}
          /&gt;
          &lt;br /&gt;
          &lt;br /&gt;
  
          {this.state.names &amp;&amp;
            this.state.names
              .filter((x) =&gt; x.name.toLowerCase().startsWith(terms))
              .map((item) =&gt; {
                return (
                  &lt;div className=&quot;data-body&quot;&gt;
                    &lt;div&gt;Name = {item.name}&lt;/div&gt;
                    &lt;div&gt;Job Profile = {item.job_profile}&lt;/div&gt;
                    &lt;div&gt;Description = {item.description}&lt;/div&gt;
                    &lt;input type=&quot;button&quot; id=&quot;button&quot; value=&quot;Delete&quot;/&gt;
                    &lt;div&gt;{&lt;br&gt;&lt;/br&gt;}&lt;/div&gt;
                  &lt;/div&gt;
                );
              })}
        &lt;/div&gt;
      );
    }
  }
  export default App;
  </code></pre>