Vue.js得到所有V模型綁定

Question

隨着Vue.js您可以在表單輸入綁定到一個屬性：

https://vuejs.org/v2/guide/forms.html

我工作的一個項目，我「動態」雖然生成表單。這裏的v模型綁定只是基於輸入名稱設置的屬性。

雖然問題是我仍然想知道如何正確地獲得這些v模型綁定。到目前爲止，所有我所看到的是人們手動設置自己的Vue的實例的屬性綁定：雖然沒有手動設置數據屬性

new Vue({ 
    el: '...', 
    data: { 
    checkedNames: [] 
    } 
}) 

是否有可能以某種方式抓住所有的v-model綁定？

當創建一個帶有變化的動態表單時，動態數量的字段會有很大幫助。

我想一個選項是簡單地從javascript輸入中檢索名稱屬性，但我希望可能已經存在一些東西，因爲v-model可能調用了一個可能已經在Vue實例中已知的setter。

返工的例子從答案：

https://jsfiddle.net/yMv7y/2477/

Answer 1

按照official documentation：

有可能反應性屬性添加到使用Vue.set(object, key, value)方法嵌套對象。

這意味着你開始data可以是這樣的：

{ 
    customForm: [], 
    values: {} 
} 

假設customForm是描述在你的自定義窗體一堆領域的領域對象的數組。它在開始時是空的，因爲你說你的表單將被動態創建。

一旦您生成了動態數據，您只需將其分配到customForm，並通過它循環以添加上述Vue.set方法的反應屬性。

下面是一個JSFiddle的例子。我正在使用this.$set，但這只是Vue.set的別名。