Posts Learn Components Snippets Categories Tags Tools new About
/

How to make Axios PATCH Request

Learn how to perform PATCH requst in Axios the easy way. This meto

Created on Aug 30, 2021

735 views

In this short snippet, you will learn how to do PATCH requests in Axios. PATCH is one of the HTTP methods available that is used to make changes to a part of the resource at a location.

How to install Axios?

To install Axios into your web application, you can use run any of the commands below.
npm install axios
yarn add axios
If you do prefer to use the CDN, you can just include the CDN below and you can right away make use of the library.
<script src="https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js"></script>

PATCH Request in Axios Code Example


To perform a PATCH request in Axios you can make use of the "patch" method available from the "axios" object. Do note that this library is a promised-based library so it supports the async/await syntax.
<script>
    import axios from 'axios';

    const response = await axios
        .patch('https://jsonplaceholder.typicode.com/posts/1', {
            title: 'foo',
        }, {
            headers: { 'Content-type': 'application/json; charset=UTF-8' }
        });

    console.log(response);
</script>
Do note that we are using a fake API for testing and the external API is below.
https://jsonplaceholder.typicode.com/posts/1
The "patch()" method accepts URL of the endpoint as the first parameter and the body of the content to be updated is the 2nd parameter while the 3rd parameter is the options.

Axios PATCH with "then" method

axios
    .patch('your-url', 'your-data', 'your-headers')
    .then((data) => console.log(data))
By now you should know How to make an Axios PATCH request, If you find it helpful do share it with your friends, and happy coding!

If you like our tutorial, do make sure to support us by being our Patreon or buy us some coffee ☕️

Load comments for How to make Axios PATCH Request

)