title: edit todo list state not passed correctly in react with axios
body: <p>I have a component that lists the current todo's which you can add your own todo's and delete todo's, which is working 100%. The only issue I am facing is updating my current todo's. I have added the necessary code below, help would be appreciated.</p>
  
  <p>I am using proptypes and can see I have warning in my console which I suspect might be the problem. Here is the warning:</p>
  
  <pre><code>Warning: Failed prop type: The prop `editTodo` is marked as required in `TodoItem`, but its value is `undefined`.
      in TodoItem (at Todos.js:10)
      in Todos (at App.js:83)
      in section (at App.js:82)
      in Route (at App.js:75)
      in main (at App.js:73)
      in div (at App.js:72)
      in Router (created by BrowserRouter)
      in BrowserRouter (at App.js:71)
      in App (at src/index.js:7)
  </code></pre>
  
  <p>Here is my edit todo button:</p>
  
  <pre><code>        &lt;div id="card-item-edit"&gt;
            &lt;button
            className="edit-btn"
            onClick={() =&gt; this.toggleForm()}&gt;
            EDIT
            &lt;/button&gt;
            {this.showEditTodoForm()}
          &lt;/div&gt;
  </code></pre>
  
  <p>In my edit todo button I have assigned a toggle function onClick which opens input field if true:</p>
  
  <pre><code>  toggleForm = () =&gt; {
      if (!this.state.isShowing) {
        this.setState({ isShowing: true });
      } else {
        this.setState({ isShowing: false });
      }
    }
  </code></pre>
  
  <p>Which passes state and opens this form onClick</p>
  
  <pre><code>  showEditTodoForm = () =&gt; {
      if(this.state.isShowing) {
        return(
          &lt;div&gt;
            &lt;form onSubmit={this.handleFormSubmit}&gt;
            &lt;input
                type="text"
                name="edit todo"
                placeholder="Edit Your Todo"
                value={this.state.value}
                onChange={this.onChange}
              /&gt;
            &lt;/form&gt;
          &lt;/div&gt;
        )
      }
    }
  </code></pre>
  
  <p>onSubmit the value is updated with Axios. I think I might be doing something wrong here, I tried testing with Postman but just can't get it working, here is my handleFormSubmit function:</p>
  
  <pre><code>  handleFormSubmit = (id) =&gt; {
      const title = this.state.title;
      event.preventDefault();
  
      axios.put(`http://localhost:3004/todos/${id}`,
        {
          title
        },
      )
        .then(() =&gt; {
  
        })
        .catch(error =&gt; console.log(error))
    }
  
  </code></pre>
  
  <p>I am also using the onChange property in the form submit, here is the function:</p>
  
  <pre><code>onChange = (e) =&gt;
    this.setState({
      [e.target.name]: e.target.value  // demo react tools to show what happens when value changes when typing
    }
    );
  </code></pre>