在Vue 2.0中添加對象屬性

Question

我正在創建一個簡單的購物車，用戶可以在其中添加一些他們希望添加到購物車的物品。

我有我傳遞到我的網頁票的數組：

"tickets":[ 
    { 
    "id":1, 
    "title":"cheap", 
    "price":"5.00" 
    }, 
    { 
    "id":2, 
    "title":"VIP", 
    "price":"19.99", 

    }, 
    { 
    "id":3, 
    "title":"General", 
    "price":"9.99" 
    } 
] 

總的想法是，我會爲用戶提供指示他們要購買的數量的輸入。在改變輸入時，新的「數量」屬性將被添加到票據對象。

我已閱讀文檔和意識到：

Vue公司不會動態允許添加新的根級別的反應特性，以一個已經創建的實例。但是，可以使用Vue.set（object，key，value）方法向嵌套對象添加反應性屬性

我通常理解這應該如何工作，但我不知道如何實際做到這一點在我的組件內部。

具體而言，如何將正確的票據對象和輸入值傳遞給方法？

在我的模板我遍歷門票：

<tr v-for="ticket in tickets"> 
    <td>{{ticket.title}}</td><td><input id="quantity" @change="update"</td> 
</tr> 

要獲得元素值，我可以這樣做：

//script 
update: function(e){ 
quantity = e.target.value 
} 

但如果我這樣做，我怎麼訪問特定的票目的？

另外，我coould通票實例：

<td>{{ticket.title}}</td><td><input id="quantity" @change="update(ticket)"></td> 

//script 
update: function(ticket){ 
//access ticket object... 
} 

但如果我這樣做，我怎麼訪問量？

Answer 1

使用特殊$event變量

<tr v-for="ticket in tickets"> 
    <td>{{ticket.title}}</td><td><input id="quantity" @change="update(ticket, $event)"</td> 
</tr> 

文檔鏈接：https://vuejs.org/v2/guide/events.html#Methods-in-Inline-Handlers