javascript - Axios 在 Controller 返回对象对象中发送 formData

Question

//Vuejs2
//Laravel v7.x
我求助于您，因为我正在阻止，我找不到解决方案。
我想在我的 Controller 中恢复对象中的数据。
在我的 View.vue 中，我发布了一个 axios 帖子

     data() {
        return {
          customer: {
             name: 'abc',
             login: 'def'
          },
          file: null
        }
    },methods: {
        submit(){
            let formData = new FormData();
            formData.append("customer", this.customer);
            formData.append("file", this.file);

            axios.post('/project/new',
                        formData, {
                            headers: {
                                "Content-Type": "multipart/form-data"
                            }
                        }).then(data => {
                        console.log(data.data);
                    });
        }
    }

我在我的 Controller 中收集这样的

public function postProject(Request $request)
{
    return $request->customer;  //return [Object Object]
    return $request->customer->name;  //return Trying to get property 'name' of non-object
    return $request->customer['name']; //return Illegal string offset 'name'
    return $request->file;  //return [Object Object]
}

谢谢你的帮助。祝你今天过得愉快。

Answer 1

您不能使用 .append将对象添加到您的 FormData。
看着 https://developer.mozilla.org/en-US/docs/Web/API/FormData/append该方法只接受 USVString 或 Blob 作为值。其他一切都被转换为字符串。
Javascript 中标准对象的字符串表示是 [object Object] .
你可以试试JSON.stringify(this.customer)将其转换为其 JSON 表示。