Vue.js和paginate

Question

任何指導讚賞。在vue過濾器中使用paginate時，我搞亂了其他過濾器。我抄一些代碼到這個小提琴：

https://jsfiddle.net/ashleywnj/kbr0obsv/2/

隨着PAGINATE加入過濾器，HTML中的剖面線23，它禁用搜索，並通過單擊列標題進行排序的能力。

<tr v-for="item in items | filterBy searchText | orderBy sortparam order |  paginate"> 

如果刪除了小提琴內PAGINATE過濾器，你會看到，你可以進行排序和搜索......我帶來了各自的價值控制檯 - 它看起來像什麼都好都帶或不帶過濾器PAGINATE ，因此我無法弄清楚如何解決這個問題或者我可能錯過了什麼。

感謝您的任何見解。

Answer 1

問題是，在您的paginate過濾器中，您使用的是this.items，其中包含列表中的所有項目，而與其他過濾器無關。傳遞給過濾器的參數list僅包含已過濾和已排序的值，並且是要分頁的內容。所以你的過濾器應該是這樣的：

paginate: function(list) { 

     this.resultCount = list.length; 

     if (this.currentPage >= this.totalPages) { 
      this.currentPage = Math.max(0, this.totalPages - 1); 
     } 

     var index = this.currentPage * this.itemsPerPage; 

     return list.slice(index, index + this.itemsPerPage); 
    }