后退网格不会使用更新的集合呈现网格

Question

我正在使用Backgrid，并在我的控制器中创建Backgrid对象，如下所示：

  $.when(recipeRequest).done(function (recipes) {
     List.grid = new Backgrid.Grid({
      columns: columns, // where columns is defined elsewhere
      collection: recipes // recipes is the result of a fetch
    })
  // Then add it to the Marionette template
}

以上工作完美，项目显示如预期

一旦表格显示出来，我们将提供过滤功能ServerSide，如下所示：

  filterRecipes: function (query) {
  // remove any incomplete network requests
    _.each(RecipeManager.fetchXhrs, function (r) {
        r.abort()
     })
  // get a filtered set of recipes
  var filteredRecipes = RecipeManager.request('recipe:entities', query)
  $.when(filteredRecipes).done(function (recipes) {
     // this line shows that the result set is being updated as expected with for example 6 results
    console.log(recipes)
    // setting the new recipe result set to the grid.collection 
    List.grid.collection = recipes 
    // here the table rerenders but there are a LOT more results on the table - not 6 as expected
    List.grid.render()  
  })
}

我希望在返回结果后用新集合重新填充表，但我的表仍然显示所有旧记录。

我下面的例子写在这里。我该如何用新数据刷新Backgrid表？那么，一旦集合被重置，它应该重新绘制表吗？还是我需要先清空桌子？有什么想法我可能会出错吗？

Answer 1

来自backgridjs

完全反应。网格的相关部分在数据更改时自动重新渲染。

我还没有看过带注释的源代码，但我猜重新渲染与collection事件有关。因此，您不需要显式调用render方法。

 $.when(filteredRecipes).done(function (recipes) {
     // this line shows that the result set is being updated as expected with for example 6 results
     console.log(recipes)
     // setting the new recipe result set to the grid.collection 
     // considering recipes is backbone collection
     // if result is array of objects then List.grid.collection.reset(recipes)
     // it should re render the grid 
     List.grid.collection.reset(recipes.models); 
 })