使用过滤器限制

instafeed.js - Limit with filters

本文关键字：过滤器      更新时间：2023-09-26

我使用instafeed.js从Instagram加载一些照片，我有一个小函数，加载feed设置一个特定的标签作为过滤器。这样的:

function generateFeed(category){
   var feed = new Instafeed({
          target: category+'Feed',
          get: 'user',
          userId: 'USERID',
          accessToken: 'TOKEN',
          sortBy: 'most-recent',
          template: '<div id="insta-card" class="animated fadeIn col-lg-4 col-md-4 col-sm-4 col-xs-4"><a class="fancybox-thumb-'+category+'" rel="fancybox-thumb" href="{{image}}"><img class="insta-img" src="{{image}}"></a><div class="insta-infos"><p>{{caption}}</p></div></div>',
          limit: '12',
          resolution: 'standard_resolution',
          filter: function(image) {
              return image.tags && image.tags.indexOf(category) >= 0;
          },
          after: function(){
            if (!this.hasNext()) {
                $('.load-button').hide();
            }else{
                $('.load-button').show();
            }
          }
        });
feed.run();
$('.load-button').on('click',function(){
        feed.next();
});
}

一切正常，但似乎限制(在本例中为12)不是加载照片的限制，而是在搜索标签时获取照片的限制。

如果在此限制中没有带有该标签的照片，那么如果这些照片存在并且具有该标签，则提要也将为空!

有办法处理这个吗?当通过过滤器搜索时，是否将限制设置为最大值(60)?

如果limit可以从feed.next()函数传递，这将是很容易的，但我还没有发现任何工作。

有人能帮我吗?

谢谢。

您应该将limit设置为更高的值，并手动限制filter函数内结果的最大数量。

为了在调用.next()时保持这种行为，您应该在每次提要加载时重置计数器:

function generateFeed(category){
  var currentCount = 0;
  var feed = new Instafeed({
    target: category+'Feed',
    get: 'user',
    userId: 'USERID',
    accessToken: 'TOKEN',
    sortBy: 'most-recent',
    template: '<div id="insta-card" class="animated fadeIn col-lg-4 col-md-4 col-sm-4 col-xs-4"><a class="fancybox-thumb-'+category+'" rel="fancybox-thumb" href="{{image}}"><img class="insta-img" src="{{image}}"></a><div class="insta-infos"><p>{{caption}}</p></div></div>',
    limit: '60',
    resolution: 'standard_resolution',
    before: function() {
      currentCount = 0;
    },
    filter: function(image) {
      // put your real limit here
      var shouldDisplay = (currentCount < 12);
      if (shouldDisplay) {
        if (image.tags && image.tags.indexOf(category) >= 0) {
          currentCount += 1;
        } else {
          shouldDisplay = false;
        }
      }
      return shouldDisplay;
    },
    after: function(){
      if (!this.hasNext()) {
        $('.load-button').hide();
      } else{
        $('.load-button').show();
      }
    }
  });
  feed.run();
  $('.load-button').on('click', function(){
    feed.next();
  });
}

请记住，如果您的API客户端处于沙盒模式，无论您将limit设置为什么，您的调用都被限制为20个项目，因此这可能对您影响不大。

相关文章：