javascript - 如何从Django View 中拉取新对象来实现无限滚动？

Question

我有一个用于新闻文章的 Django 应用程序。我想首先加载 6 篇文章，当用户滚动浏览它们时，新的 6 篇文章会自动加载(twitter 风格的无限滚动):

我找到了this包，但它已被弃用，所以我按如下方式进行操作。

这是 View :

def index(request):
    context_dict = {}

    articles = Article.objects.order_by('-pub_date')[:6]
    context_dict['articles'] =  articles
    context_dict['title'] = "title "
    context_dict['endless_scroll_token'] = '/home/'

    return render(request, 'obj_name/index.html', context_dict)

这是 java 脚本/AJAX 代码:

  <script>
  function yHandler(){

      var wrap = document.getElementById('body_panel');
      var contentHeight = wrap.offsetHeight;
      var yOffset = window.pageYOffset; 
      var y = yOffset + window.innerHeight;

      if(y >= contentHeight){
        var ourRequest = new XMLHttpRequest();
        var token = {{endless_scroll_token}};

        if(token == "/home/")
          {token = '/';}

        ourRequest.open('GET', token);
        ourRequest.send();

        ourRequest.onload = function(){
        var ourData = ourRequest.responseText;
        wrap.innerHTML += ourData

      };
    }
  }
  window.onscroll = yHandler;
</script>

问题是这样一来，同样的 6 篇文章就会被一遍又一遍地加载。如何每次提取 6 篇新文章？

谢谢!

Answer 1

这称为分页

对数据进行分页的方法有很多种。您可以阅读http://www.django-rest-framework.org/api-guide/pagination/

例如，您告诉服务器您想要第 2 页的数据。并且您和服务器还需要知道每个页面中包含多少个项目。 (这是上面文档中的PageNumberPagination)

我强烈建议您查看 Django Rest 框架，因为它为您提供了许多功能，包括分页。