Search
 
SCRIPT & CODE EXAMPLE
 

JAVASCRIPT

how to send axios delete to the backend reactjs

axios.delete(URL, {
  headers: {
    Authorization: authorizationToken
  },
  data: {
    source: source
  }
});
Comment

ReactJS Axios Delete Request Code Example

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>  
    )  
  }  
}
Comment

PREVIOUS NEXT
Code Example
Javascript :: dayjs tostring 
Javascript :: how to create package.json file in vs code 
Javascript :: jsonwebtoken error with react js 
Javascript :: react 18 
Javascript :: how to convert seaconds into hh:mm:ss in javascript 
Javascript :: javascript slice vs splice 
Javascript :: add dark mode to react 
Javascript :: create an element jquery 
Javascript :: JS toString adds backslash 
Javascript :: remove special characters in javascript 
Javascript :: react native vector icons not showing 
Javascript :: javascript select multiple values 
Javascript :: mongoose countdocuments 
Javascript :: vue toggle boolean on click 
Javascript :: lpad javascript 
Javascript :: how to disable and enable a button in jquery 
Javascript :: get url query in react 
Javascript :: create select option using jquery 
Javascript :: while and do while loop in javascript 
Javascript :: how to convert string to sentence case in javascript 
Javascript :: graphql request with jquery ajax 
Javascript :: js get all dublicates indexes in array 
Javascript :: sum all values of an array 
Javascript :: how to find duplicate values in an array javascript 
Javascript :: jquery: select select box rpogramatically 
Javascript :: how to check if text input has spaces javascript 
Javascript :: javascript mouse over and mouse enter 
Javascript :: javascript is url 
Javascript :: how to give width through props 
Javascript :: js compare elements of two arrays 
ADD CONTENT
Topic
Content
Source link
Name
9+3 =