Question

假设我有大约500行数据并且在网格内显示每页40行。我一直在思考网格是如何工作的，500行显示下一页与数据相对应。

我有两个选择.... 1首先是您对BD进行单个查询，并在内存中保留500行并从那里开始工作并在每次传递页面时进行剪切。

第二秒，将查询运行到数据库，剪切以显示必要的行，然后显示。每次我通过页面进行新的查询，带来500并切换数据并仅显示所需内容。

所以问题是应该有一个网格来处理数据的理想操作是什么？充分发挥绩效。

Answer 1

如果你试着看一下更常见的情况，即数据集中有N行，你需要在页面上显示M，那么很明显，N大到足够大，在大多数情况下，它确实没有意义加载内存中的所有数据（但是你可能这样做是为了预热缓存等）

通常，您一次从数据库加载一个页面，将pageNumber和pageSize参数传递给查询。

此外，您可以使用客户端缓存并在导航到新页面时保存旧页面。在浏览器中使用LocalStorage，WebSql等非常简单。

 function getNewPage(pageNumber, pageSize) {
      var cacheKey = pageNumber + '_' + pageSize

      if (myCache.contain(cacheKey)) { 
         return $.deferred().resolve(myCache.get(cacheKey))
      }

      return $.ajax( url , { pageSize:pageSize, pageNumber: pageNumber }, function (data) {
           myCache.set(cacheKey, data)
           return data
      } )
 } 

 var myCache = { 
    contain: function(key) {
       return !!sessionStorage.getItem(key)
    },
    get: function(key) {
       return JSON.parse(sessionStorage.getItem(key)
    },
    set: function(key, o) {
       sessionStorage.setItem(key, JSON.stringify(o)) 
    } 
 }

以及某个按钮点击处理程序中的某处：

 getNewPage(0,10).done(function(data) {
     var template = _.template('<tr><td>{field1}</td><td>{field2}</td></tr>')
     $myTableTbody.html(data.map(template))
 })

传递到下一页时网格如何工作？

1 个答案: