Vue 2 Laravel 5.3列の値の1つでオブジェクトをグループ化する

Question

プロジェクトでは、クライアントがアイテムをカートに入れることができます。各商品はshop_idのショップに関連しています。私はカートビューでアイテムをリストしたいと思うでしょう。しかし、私はこれらの項目が同じshop_idのもののためにテーブルの下にグループ化されることを望みます。したがって、クライアントが3つの異なる店舗から購入した場合、カートビューには3つの表があり、各表はクライアントがその店から購入したそれぞれの項目で構成されます。これを行う良い方法はありますか？ここで

はあなたの参照のための私の未完成Cart.vueコードですが、私はそれが私のカートテーブル構造

<template> 
    <div class="row"> 
    <div class="col-md-12 cart-container"> 
     <table class="table table-hover" v-for="cart in carts"> 
     <thead> 
      <tr> 
      <th>{{cart.shop.name}}</th> //cart includes shop by eloquent 
      </tr> 
     </thead> 
     <tbody> 
      <tr> 
      <td> 
       <div class="cart-img-wrapper"> 
       <img class="cart-img" :src="cart.product_choice.img1"> 
       </div> 
      </td> 
      <td>Otto</td> 
      <td>@mdo</td> 
      </tr> 
     </tbody> 
     </table> 
    </div> 
    </div> 
</template> 

<script> 
    export default { 
    data(){ 
     return{ 
     carts:{}, 
     } 
    }, 
    props:[ 
    ], 
    mounted(){ 
     this.getCartItems() 
    }, 
    updated(){ 
    }, 
    methods:{ 
     getCartItems(){ 
      var vm = this 
     vm.$http.get('/getCartItems/').then((response)=>{ 
      vm.carts = response.data 
     }); 
     }, 
    }, 
    computed:{ 
    } 
    } 
</script> 

多くのを助けることができると思ういけない：

Schema::create('carts', function (Blueprint $table) { 
     $table->increments('id'); 
     $table->integer('product_id')->unsigned(); 
     $table->integer('product_choice_id')->unsigned(); 
     $table->integer('user_id')->unsigned(); 
     $table->integer('shop_id')->unsigned(); 
     $table->integer('qty'); 
     $table->integer('complete')->default(0); 
     $table->timestamps(); 
     $table->foreign('user_id') 
       ->references('id') 
       ->on('users') 
       ->onDelete('cascade') 
       ->onUpdate('cascade'); 
     $table->foreign('product_id') 
       ->references('id') 
       ->on('products') 
       ->onDelete('cascade') 
       ->onUpdate('cascade'); 
     $table->foreign('shop_id') 
       ->references('id') 
       ->on('shops') 
       ->onDelete('cascade') 
       ->onUpdate('cascade'); 
     $table->foreign('product_choice_id') 
       ->references('id') 
       ->on('product_choice') 
       ->onDelete('cascade') 
       ->onUpdate('cascade'); 
    }); 

Answer 1

これは、GROUP BYを使用して解決できるべきですあなたのDBに照会してください。

var groupBy = function(xs, key) { 
    return xs.reduce(function(rv, x) { 
    (rv[x[key]] = rv[x[key]] || []).push(x); 
    return rv; 
    }, {}); 
}; 

：あなたはjavascript配列を持っていて、それを処理したい場合は、次のようなメソッドを記述することができます

SELECT column_name, aggregate_function(column_name) 
FROM table_name 
WHERE column_name operator value 
GROUP BY column_name; 

---

：あなたはMySqlを使用している場合は、このようなクエリを書くことができます

source

しかし、このようなものをデータベースに委譲する方が一般的に効率がよく、エラーが起こりにくくなります。