javascript - VueJs2 计算不更新。为什么？

Question

我有更新的 grid example来自官方的例子。在我的应用程序中需要将填充 sortOrders 数组移动到

 created: function () {
        var vm = this;
        this.columns.forEach(function (key) {
      vm.sortOrders[key] = 1
    })
  },

尝试对列进行排序，但排序只发生一次。

重现步骤:单击以“命名”列标题 1 次以上。期望:每次单击列标题时列排序得到:只对列进行一次排序。

https://jsfiddle.net/xkkbfL3L/1916

不明白为什么

Vue.set(this.sortOrders, key, order);

不要强制使用 this.sortOrders 变量

如果像这样使用 tmp 变量就可以正常工作

   var order = this.sortOrders[key]*-1;
   var tmp = this.sortOrders ;
   Vue.set(tmp, key, order); 
   this.sortOrders = [];
   this.sortOrders = tmp;

https://jsfiddle.net/xkkbfL3L/1919/

Answer 1

当您将 1 更改为 -1 时，Vue 似乎没有触发更新，对我来说这似乎不是预期的行为。可能值得filing an issue在 Vue 的 Github 页面上，其中一位 vue 开发人员可能能够解释有关此行为的更多信息。然而，作为一种快速解决方法，您可以在应用更新的键值之前简单地将 this.sortKey 设置为 null:

sortBy: function (key) {
  this.sortKey = null;
  this.sortKey = key;
  var order = this.sortOrders[key]*-1;
  Vue.set(this.sortOrders, key, order);
}

这是 JSFiddle:https://jsfiddle.net/xkkbfL3L/1920/