ajax如何保存修改后的数据,修改实例数据，而AJAX提交，恢复输入数据

ajaxSubmit: function(event) {

this.loader = true;

var form = event.target;

var action = form.getAttribute('action');

var data = new FormData(form);

var method = form.getAttribute('method').toUpperCase();

this.$http({

body: data,

method: method,

url: action

}).then(function(response) {

if (response.body.alerts) {

response.body.alerts.forEach(function(alert) {

this.alerts.push(alert);

}.bind(this));

}

this.loader = false;

}, function(response) {

// same as success callback

});

}

比方说，我有一个“测试”的默认值的输入。如果我更新为“Test111”然后提交。该值将恢复为“测试”。提交的值是正确的，因为“Test111”被保存到我的数据库中，并且在刷新后，输入具有正确的值。

我设法缩小了这个问题。我观察到，只有在ajaxSubmit方法中更改实例上的数据时才会发生。例如，如果我删除行：

this.loader = true;

this.loader = false;

this.alerts.push(alert);

一切都按预期工作。

此外，如果输入通过v-model绑定到实例，则不会恢复其值。

因此，最终我想我发现了问题的根源，但我不明白，而且我也解决不了。

任何帮助将不胜感激！

+0

@craig_h它是一个大型应用程序的一部分，但我设法将一个简单的小提琴放在一起，它复制了这个问题：https://jsfiddle.net/ilpet/v3xx02n9/ –