【问题标题】：Vuejs won't send correct dataVuejs 不会发送正确的数据
【发布时间】：2021-03-15 03:45:17
【问题描述】：

我有图像字段，当我更改图像时it does 更改图像并且在将其发送到后端之前我可以看到值是正确的，但发送的数据值是空的！

代码

Commented

save_changes() {
    /* eslint-disable */
    if (!this.validateForm) return;
    console.log("image: ", this.data_local.image); // new image data are present
    this.$http
    .put(
        "/api/admin/posts/meta/" + this.$route.params.id,
        this.data_local, // new image data is empty!
        {
        headers: {
            Authorization: localStorage.getItem("access_token"),
        },
        }
    )
    .then((res) => {
    }
    //rest of it...
},
update_avatar(event) {
    this.dialogVisible = true;
    this.dialogImageUrl = URL.createObjectURL(event.target.files[0]);
    this.data_local.image = event.target.files[0]; // this is where I sent selected image and pass it to my `data_local` array objects
},

截图

有什么建议吗？

更新

标头请求

【问题讨论】：

我不明白你向我们展示了response 选项卡并写信给它sent data to back end 这就是你从后端收到的数据......你应该去header 选项卡和向下滚动到参数并向我们展示
@Ifaruki 我收到了，因为我将数据转储到控制器中以查看我得到了什么。如您所见，控制器说我收到的图像是空的。
向我们展示标题选项卡以查看数据是否真的没有发送到服务器仍然很棒
@Ifaruki 更新

标签： javascript typescript vue.js

【解决方案1】：

您可以尝试将其作为 FormData 发送

let file = this.data_local.image
let image = URL.createObjectURL(file)
let formData = new FormData();
formData.append("image", image);
formData.append("id", 71);
formData.append(....)
this.$http
.put(
    "/api/admin/posts/meta/" + this.$route.params.id,
     formData, 
    {
    headers: {
        Authorization: localStorage.getItem("access_token"),
    },
    }
)
.then((res) => {
}

标题应如下所示：

你的图片应该有这个(binary)

【讨论】：

它只是给了我空的 formData formData: FormData {} 没有任何东西传递给控制器。
是的，头部就像您编辑的部分binary，但无法在后端获取任何数据，不知道为什么！
@mafortis 你用什么后端语言
@mafortis 也许这有帮助stackoverflow.com/questions/44354370/…
我有，对我来说，问题不是如何存储图像，而是无法将其放入后端。 formData 将我的图像值发送为image {}