vue.jsで同じテンプレートを複数回バインドするにはどうすればいいですか？

Question

ページフォームを送信すると、jsonオブジェクトを返すバックエンドサービスへのajax呼び出しが行われます。オブジェクトはvue.jsテンプレート（特定のidを持つdiv）にバインドされていません。 Everythiongは最初の提出時に期待どおりに機能します。ただし、次のフォーム送信時にビューは更新されません（最初の送信からのデータはまだ表示されます）。

<div id="Response"></div> 

$('#Form').submit(function (e) { 
    e.preventDefault(); 
    var $form = $(e.target); 
    $.ajax({ 
     url: 'https://somewhere, 
     type: 'POST', 
     data: $form.serialize(), 
     dataType: 'json', 
     success: function(response) { 
      if (response) { 
       var app = new Vue({ 
        el: '#Response', 
        data: response 
       }); 
      } 
     } 
    }); 
}); 

これを正しく実行する方法は、フォームが送信されるたびに、最後の応答に基づいてビューが適切に更新されますか？

Answer 1

これで、応答ごとに新しいvueインスタンスが作成されます。最初にvueインスタンスをマウントし、その応答を使用してvueインスタンス内のデータを更新する必要があります。