Problem with PUT request in axios with vue.js

try to add the method field to the form and send it in post way like this

formData.append('_method', 'PUT')

then try to send the data regularly I think it work like this:

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js">
import axios from 'axios';
export default {
    data: function() {
        return {
            value: 0,
            lampName: 'Kitchen',
        };
    },
    mounted () {
        axios
        .get("http://127.0.0.1:5000/lamp/" + this.$route.params.id)
        .then(response => (this.value = response.data))
    },
    methods: {
        updateValue () {
            let formData = new FormData();
            formData.append("value", this.value);
            formData.append("lampName", this.lampName);
            formData.append('_method', 'PUT');

            axios
                .post('http://127.0.0.1:5000/lamp/' + this.$route.params.id,
                formData
            })
        }
    }
}
</script>

So this is the failing request:

axios
    .put('http://127.0.0.1:5000/lamp/' + this.$route.params.id,
    {value: this.value},
    {headers: {
        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
    }
})

I don't know what your server is expecting but you're setting a content-type of application/x-www-form-urlencoded while sending JSON data. It seems likely this mismatch is the cause of your problems. You should be able to see this if you inspect the request in the Network section of your browser's developer tools.

If you need to use application/x-www-form-urlencoded then I suggest reading the axios documentation as you can't just pass in a data object like that:

https://github.com/axios/axios#using-applicationx-www-form-urlencoded-format

In short, you need to build up the body string manually, though there are utilities to make that less onerous.

If you actually want JSON data then just remove the content-type header. Axios should set a suitable content-type for you.

Pass your method as post method and define put in form data formData.append('_method', 'PUT') .

     updateValue () {
            axios
                .post('http://127.0.0.1:5000/lamp/' + this.$route.params.id,
                {value: this.value, _method: 'PUT'},
                {headers: {
                        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
                }
            })
        }