title: Reactjs -Each child in an array or iterator should have a unique "key" prop
body: <pre><code>import React from 'react';
  import {Jumbotron} from 'react-bootstrap';
  import axios from 'axios';
  import './App.css'
  
  export default class Form extends React.Component{
  
  state={
      user:[],
      firstname:'',
      lastname:'',
  }
  handleChange = event =&gt; {
      this.setState({firstname:event.target.value});
      this.setState({lastname:event.target.value});
  }
  
  handleSubmit = event =&gt;{
      event.preventDefault();
  
      axios.post('http://9795ca45.ngrok.io/api/Docs',{
          fname:this.state.firstname,
          lname:this.state.lastname
      })
      .then( res =&gt; {
          console.log(res);
          console.log(res.data);
      })
      .catch((error) =&gt;{
          alert(error);
      })
  }
  
  componentDidMount(){
      axios.get('http://9795ca45.ngrok.io/api/Docs')
      .then(res =&gt;{
          const data=res.data;
  
          const user = data.data;
  
          this.setState({user});
      })
      .catch((error) =&gt;{
          alert(error);
      })
  }
  
  render(){
      return(
          &lt;div&gt;
              &lt;Jumbotron&gt;
                  &lt;form onSubmit={this.handleSubmit}&gt;
                  &lt;label&gt;
                      firstName:
                      &lt;input type=&quot;text&quot; name=&quot;firstname&quot; onChange={this.handleChange} /&gt;
                      &lt;/label&gt;
                  &lt;label&gt;
                      LastName:
                      &lt;input type=&quot;text&quot; name=&quot;lastname&quot; onChange={this.handleChange} /&gt;
                      &lt;/label&gt;
                      &lt;button type=&quot;submit&quot;&gt;add&lt;/button&gt;
                      &lt;/form&gt;
              
                  &lt;h1&gt; names &lt;/h1&gt;
                  &lt;ul&gt; {this.state.user.map(person =&gt; &lt;li&gt; {person.lname}&lt;/li&gt;)}&lt;/ul&gt;
                  &lt;/Jumbotron&gt;
                  &lt;/div&gt;
      )
  }
  }
  </code></pre>
  <p>am very new to reatjs
  am trying to post the data to the url but am getting request not found 500 error
  and i see this using debugger</p>
  <p><strong>Warning: Each child in an array or iterator should have a unique &quot;key&quot; prop.
  Check the render method of <code>Form</code>.</strong></p>
  <p>please help me to come away from this</p>
  <p>am getting the data from the url
  but i unable to post the data</p>
  <p>please check it and correct my code with an explanation</p>