Issue with posting FormData with axios

Hi everybody, I want to send a file with FormData to my backend, however I'm getting an empty object when I inspect the request body.

My component where I create FormData and append values:

<template>
<transition name="modal-fade">
<section class="modal_overlay_maincontainer" @click.self="hideModal()">
    <form class="modal_container">
        <i class="modal_close fa fa-times-circle" title="Cerrar" @click="hideModal()"></i>
        <h2 class="modal_title">Nueva publicación</h2>
        <div class="horizontal_centered_gradient_line"></div>
        <div class="modal_inputs_container">
            <div class="modal_input_column_container">
                <label class="modal_input_label">Imagen:</label>
                <button class="modal_image_container" @click="$refs.image.click()" type="button">
                    <div class="modal_image_button">
                        <i class="modal_image_button_icon fas fa-cog"></i>
                        <span class="modal_image_button_text">Cambiar</span>
                    </div>
                </button>
                <input type="file" ref="image" style="display:none;">
            </div>
            <div class="modal_input_column_container">
                <label class="modal_input_label">Descripción de la imagen:</label>
                <input class="modal_input_text" ref="imageDescription" type="text" placeholder="Titulo de la publicación" required>
            </div>
            <div class="modal_input_column_container">
                <label class="modal_input_label">Categoría:</label>
                <select class="modal_input_select" ref="category" required>
                    <option v-for="postcategory in postcategories" :key="postcategory.id" :value="postcategory.id">{{ postcategory.name }}</option>
                </select>
            </div>
            <div class="modal_input_column_container">
                <label class="modal_input_label">Titulo:</label>
                <input class="modal_input_text" ref="title" type="text" placeholder="Titulo de la publicación" required>
            </div>
            <div class="modal_input_column_container">
                <label class="modal_input_label">Contenido:</label>
                <textarea class="modal_input_textarea" ref="body" placeholder="Contenido de la publicación" required></textarea>
            </div>
        </div>
        <div class="horizontal_centered_gradient_line"></div>
        <div class="modal_buttons_container">
            <button class="modal_button boot_blue" type="button" @click="onGetNewPostData()">Guardar</button>
            <button class="modal_button boot_greyer" type="button" @click="hideModal()">Cancelar</button>
        </div>
    </form>
</section>
</transition>
</template>
<!--SCRIPTS-->
<script>
import { mapState, mapActions } from 'vuex'
export default {

name: 'PostCreateModal',
   
mounted() {
    console.log(this.$options.name + ' component succesfully mounted');
},

computed:{
    ...mapState('Posts', ['loadingStatus','postcategories']),
    ...mapState('AdminModal', ['modalPayload'])
},

methods:{

    ...mapActions('Posts', ['createPost']),
    ...mapActions('AdminModal', ['hideModal']),

    onGetNewPostData() {
                
        let post = new FormData();
        post.append('image', this.$refs.image.files[0]);
        post.append('imageDescription', this.$refs.imageDescription.value);
        post.append('category', this.$refs.category.value);
        post.append('title', this.$refs.title.value);
        post.append('body', this.$refs.body.value);
        this.createPost(post);
    }

}

}
</script>

My module where I do the ajax post call:

createPost({ commit }, post) {
        for (var pair of post.entries()) {
            console.log(pair[0]+ ', ' + pair[1]); 
        }
        commit( 'SET_LOAD_STATUS', 1 );
        axios.post('/posts', { post: post })
        .then((response) => {
            commit( 'SET_LOAD_STATUS', 2 );
        }, 
        (error) => {
            console.log(error);
            commit( 'SET_LOAD_STATUS', 3 );
        })
    },

Now in my controller I do:

dd($request->all());

And get this:

array:1 [
  "post" => []
]