在 vue 组件上通过 ajax 发送数据时如何附加数据对象？

Question

我的脚本通过 ajax axios 像这样发送数据：

let formData = new FormData()
formData.append('file', user.avatar)
formData.append('selected_data', user)

axios.post(this.baseUrl+'/member/profile/update',
    formData,
    {
        headers: {
            'Content-Type': 'multipart/form-data'
        }
    }
).then(function(response) {
    console.log('sukses')
})
.catch(function(error) {
    console.log('fail')
})

如果我这样做：

console.log(user.avatar)
console.log(user)

结果是这样的：

我在后端的代码（我使用 laravel 框架）是这样的：

public function update(Request $request)
{
    echo '<pre>';print_r($request->all());echo '</pre>';
    die();
}

结果是这样的：

为什么选择的数据不是显示数据对象？

如果图片不显示，看这个：

图片 1：https://postimg.org/image/hqshs9l23/

图片 2：https://postimg.org/image/i3jvyi8hn/

Answer 1

它说 [object Object] 因为它已转换为字符串。 FormData 将这些作为字符串发送。您可以使用 JSON.stringify(user) 之类的东西将其转换为字符串，然后附加它。

也许这样的事情可以解决您的问题。

formData.append('selected_data', JSON.stringify(user))

然后您可以在后端代码中将其转换回对象。

在 vue 组件上通过 ajax 发送数据时如何附加数据对象？

How can append data object when send data via ajax on vue component?

image-uploading

laravel

vue.js

vue-component

vuejs2