“Reactjs Axios Delete Code пример кода запроса” Ответ

Reactjs Axios Delete Code пример кода запроса

import React from 'react';  
    
import axios from 'axios';  
    
export default class PostList extends React.Component {  
  state = {  
    photos: []  
  }  
    
  componentDidMount() {  
    axios.get(`https://jsonplaceholder.typicode.com/photos`)  
      .then(res => {  
        const photos = res.data;  
        this.setState({ photos });  
      })  
  }  
    
  deleteRow(id, e){  
    axios.delete(`https://jsonplaceholder.typicode.com/photos/${id}`)  
      .then(res => {  
        console.log(res);  
        console.log(res.data);  
        const photos = this.state.photos.filter(item => item.id !== id);  
        this.setState({ photos });  
      })  
    
  }  
    
  render() {  
    return (  
      <div>  
        <h1> Example of React Axios Delete Request </h1>  
    
        <table className="table table-bordered">  
            <thead>  
              <tr>  
                  <th>ID</th>   
                  <th>Title</th>  
                  <th>Image</th> 
                  <th>Action</th>  
              </tr>  
            </thead>  
    
            <tbody>  
              {this.state.photos.map((photo) => (  
                <tr>  
                  <td>{photo.id}</td>  
                  <td style={{textAlign:"center"}}>{photo.title}</td>  
                  <td><img src={photo.thumbnailUrl}></img></td> 
                  <td>  
                    <button className="btn btn-danger" onClick={(e) =>          this.deleteRow(photo.id, e)}>Delete</button>  
                  </td>  
                </tr>  
              ))}  
            </tbody>  
    
        </table>  
      </div>  
    )  
  }  
}