Vue.jsはあなたがプロパティにフォーム入力をバインドすることができVue.jsで

Question

すべてのVモデルバインディングを取得：

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

私は「動的」しかし、フォームを生成するプロジェクトに取り組んでいます。ここで、vモデルのバインディングは、入力が持つ名前に基づいて設定されている属性だけです。

しかし、問題は、これらのvモデルバインディングを正しく取得する方法が不思議に思えていることです。これまでのところ、私が見てきたすべての人々が手動で結合するために彼らのVueのインスタンスにプロパティを設定することです：

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

それは何らかの形で、手動でデータプロパティを設定せずにかかわらず、v-modelバインディングのすべてをつかむことはできますか？

バリエーションが動的なフィールドを動的に作成する場合、これは多くの手助けをします。

私は、javascriptを使って名前の属性を入力から単純に取得していると思いますが、既にv-modelがVueインスタンスで既に知られている可能性のあるセッターを呼び出している可能性があるので、

は答えから例を作り直しました：

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の別名です。