无法使用Vue前端和laravel服务器上载文件

我正在尝试上传一个文件（文件可以是任何东西，例如图像、pdf或文档，绝对可以是任何东西）。为此，我在下面的Vue组件中制作了一个测试表单

<form class="mt-5" method="post" enctype="multipart/form-data" id="uploadForm">
        <div class="form-group">
            <input type="file" id="test" name="test" class="form-control">
        </div>
        <button @click.prevent="uploadFile" type="button" class="btn btn-sm btn-primary">Upload</button>
</form>

因此，当我

console.log（something）

时，它会向我显示上载文件的信息，但当我使用axios和

dd（$request->all（））

将数据发送到服务器时，它会向我显示

something=>[]

一个空数组，这意味着我无法获取该文件，因此无法进一步处理以将其保存到我的文件夹中（上载）

---

我在这里做错了什么？

这是因为在使用axios发出请求时，您没有将标题

内容类型设置为
多部分/表单数据（默认情况下使用的是应用程序/json），并且enctype属性无效，因为您没有使用默认表单提交操作。因此，尝试在post方法中传递第三个参数，指定正确的
内容类型
标题

const uploadAvatar=（{id，file}）=>{
const formData=new formData（）；
formData.append（'avatar'，文件）；
返回axios.post（`users/${id}/avatar`，formData{
标题：{“内容类型”：“多部分/表单数据”}，
});
};

uploadFile() {
                let something = $('#test').prop('files')[0];
                console.log(something);
                let form_data = new FormData();
                form_data.append('file', something);
                console.log(form_data);
                axios.post('/upload/file', { form_data })
                    .then(() => {
                        console.log("done");
                    })
            },