Learn React with TypeScript 3

Updating data with axios

Let's move on to updating data now. We are going to allow the user to click an Update button in an existing post to change and save it:

1. Let's first create an Update button in each list item in the posts:

<li key={post.id}>  <h3>{post.title}</h3>  <p>{post.body}</p>  <button onClick={() => this.handleUpdateClick(post)}>    Update  </button></li>

2. We can now implement the Update button click handler, which sets the post being edited in the component state:

private handleUpdateClick = (post: IPost) => {  this.setState({    editPost: post  });};

3. In our existing save click handler, we need two branches of code now for the existing POST request and the PUT request we need to implement:

private handleSaveClick = () => {  if (this.state.editPost.id) ...