2016-10-14 37 views
1

爲了更好地理解,以下是我的兩個模型。Vue.js和Laravel通過一次調用更新多行

模型圖像

class Image extends Model 
{ 

...  

    public function item() 
    { 

     return $this->belongsTo(Item::class); 
    } 
} 

型號項目:

class Item extends Model 
{ 

...  

    public function images() 
    { 

     return $this->hasMany(Image::class); 
    } 
} 

在我看來,我使用laravel的葉片發動機的混合物,Vue.js看起來像這樣:

<div class="form-group"> 
    <label>@lang('app.user.edit.images')</label> 
    <div v-for="(img, index) in my.images"> 
     <input type="text" name="images[]" class="form-control images" v-model="my.image"> 
    </div> 
</div> 

這給我一個輸入的任何圖像的項目。通過更改每個圖像的值我想更新所有數據庫。我不知道將name="images[]"這樣的輸入命名爲數組是否是一種好的做法。

我對圖像數據庫表看起來像這樣:

+----+---------+-------+------------+------------+ 
| id | item_id | image | created_at | updated_at | 
+----+---------+-------+------------+------------+ 

希望,你們當中有些人在過去同樣的問題,可以幫助我。

回答

3

您需要將ID傳遞給系統,以便您可以在另一端抓取它們以更新數據庫。

<div class="form-group"> 
    <label>@lang('app.user.edit.images')</label> 
    <div v-for="img in my.images"> 
     <input 
      type="text" 
      v-bind:name="'images[' + img.id + ']'" 
      class="form-control images" 
      v-model="img.image" 
     > 
    </div> 
</div> 

,這將在「ID」 =>「URL」,其應該讓你適當地更新圖像

的格式發送在請求對象的陣列