vue.jsからaxiosを使って送信した値をlaravelで受け取ると"[object Object]"になってしまう。

Question

laravel,vue.jsを使い画像複数枚投稿の編集機能を実装しています。
現在はVue.jsでaxiosを使ってlaravelにデータを渡す処理をしているところです。

やりたいこと：　配列boxをforeachで回して取得した中身をlaravel側に送りたいです。

現状: laravel側で値を受け取ると"[object Object]"になってしまいます。しかし追記にもありますが、image,edit_id単体で入れると正しく入る。

fileオブジェクトとedit_idを持った要素がboxの中に配列の形で入っている状態です。

　　　　　　　　　　　data() {
              　　　　return {
                　　　　box: []
              　　　　}
            　　　　},　　
　　　　　　　　　　　...省略

　　　　　　　　　　　let test = {
                  　image: edit_image,
                  　edit_id: img.id
                　}
                　this.box.push(test)
　　　　　　　　　　　...省略

　　　　　　　　　　　dataform = new FormData();
　　　　　　　　　　　this.box.forEach(function(ele) {
                    dataform.append('box[]', ele);
                  })
　　　　　　　　　　　...省略

                  axios.post(path, dataform).then(res => {
                    console.log('done')
                  }).catch(function(error){
                    console.log(error)
                  })

Laravel側に送られてくる値です
$request->box
=> [
     "[object Object]",
     "[object Object]",
   ]
$request->box[0]
=> "[object Object]"

this.boxの中身

eleの中身

試したこと
https://qiita.com/nicopinpin/items/cb3eb74440299e2e84f7

fileオブジェクトとedit_idを持った要素をlaravel側で受け取ることができません。
送信の仕方に問題があるかと思いましたが、解決策が見つからない状態です。

どなたかお分かりになる方居ましたら、知恵を貸していただきたいです。
よろしくお願いします。

以下追記です。

console.log(dataform.getAll('box[]'))の結果です。
dataformの中身で既にobjectになっているので、やはりappendの部分が怪しいかと思います。

こんな感じで渡すと下記の写真の様になります。値は入るが、１つのオブジェクトにまとめて入れることが出来ない、といった感じです。
dataform.append('box[]', ele.edit_id);
dataform.append('box[]', ele.image);

dataform.append('box', JSON.stringify(ele));
上記で送りましたが、json_decodeで正しく受け取れません。文字列が多すぎて、カラム名を選択して呼べない状態でした。(自分の理解力が低く正しくできていない可能性あり)

Answer 1

boxと言う箱を作って、写真のファイル名を追加する。編集の場合には追加で元の写真のidを追加しておく。
下記の様に実装するといけました。

            data() {
              return {,
                box: [],
              }
            },
　　　　　　　　　　// boxに追加
                let test = {
                  file_name: edit_image.name,
                  edit_id: img.id
                }
　　　　　　　　　　...省略
                this.box.push(test)
　　　　　　　　　　　this.box.forEach(function(ele, i) {
                    let koko = JSON.stringify(ele)
                    dataform.append('box[]', koko);
                  })

fileオブジェクトは他の情報と一緒におくれないんですね。学びになりました。