オブジェクトの代わりに配列を返すlaravel/javascript ajax call

Question

フロントエンドのVueコンポーネントを作成しています。このため私はLaravelプロジェクトのデータとデータベースを使用しています。私が得た問題は、Laravelのメソッド（AJAX呼び出しも同様）がArrayを返すことであり、もう一つのメソッドはAJAX呼び出しでオブジェクト（コレクション？）を返すことです。私は私のコンポーネントでいくつかの配列関数を使用しているので、Arrayを返す両方の呼び出しが必要です。

私はバックエンドとしてフロントエンドですべての種類のものを試しました。私はバックエンドでlaravelに配列を返そうとしましたが、フロントエンドではオブジェクトを配列に設定しようとしました。どちらも成功しなかった。

私のJSコード（そして、AJAX呼び出し）

methods: { 

     countAllItems() { 
      this.countItems = this.items.length; 
     }, 

     getUrl(items) { 

      let results = items; 

      results.forEach((item) => { 

       let id = item.id; 

       return item.url = `/advertisements/show/${id}`; 
      }); 

     }, 

     getMax(items) { 

      let boats = items.slice(0, 4); 

      this.items = boats; 

      this.getUrl(this.items); 
      this.countAllItems(); 

     }, 

     getBoats() { 

      axios.get('/api/boats') 
       .then((response) => { 

        //this will return an array 
        console.log(response.data); 
        this.items = response.data; 

        this.countAllItems(); 
        this.getMax(this.items); 




       }) 
       .catch((error) => console.log(error)); 

     }, 

     getReservations() { 

      axios.get('/api/popular') 
       .then((response) => { 

        //this will return objects, and must be an array 
        console.log(response.data); 
        this.items = response.data; 

        this.countAllItems(); 
        this.getMax(this.items); 

       }); 
     } 

    }, 

    created() { 
     this.getBoats(); 
     this.getReservations(); 
    } 

バックエンド

//This will return the array 
public function boats() { 

    return Boat::with('media')->get(); 

} 

//This will return objects 
public function messages() { 

    $boats = Boat::with('media')->get()->sortByDesc(function($boat) { 
     return count($boat->conversations); 
    }); 

    return $boats; 

} 

は私を助けることができる誰かがありますか？ですから、私はLaravelメソッドで配列を返すための修正か、JavaScriptの配列に両方のオブジェクトをプッシュする関数のようなものが必要です。

編集

だから私はいくつかのことをしようと、何かが私に起こったことをやって。 dd($boats)を実行すると、コレクションが返されます。 dd($boats->toArray)を実行すると、配列が返されます。奇妙なことは、AJAX呼び出しではそれほど違いがないということです。従って$boats->toArray()は配列内のオブジェクトではなくオブジェクトだけを返します。

また、配列内のオブジェクトをプッシュしようとしましたが、それも動作しません。コレクションとして（オブジェクトとして）配列に配置されます。これをどのように変更して、コレクションとしてオブジェクトではなく配列にオブジェクトを直接挿入することができますか？

let arr = []; 

arr.push(response.data); 

console.log(arr); 

Answer 1

コレクション操作上の問題だと思いますが、コレクション操作を行うと値が変更されます。

public function messages() { 
    $boats = Boat::with('media')->get(); 
    $sorted = $boats->sortByDesc('do your sort here'); 

    return $sorted->values(); 
}