0

我正在使用 instafeed.js 从 Instagram 加载一些照片，并且我有一个小功能可以加载将特定标签设置为过滤器的提要。像这样：

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）？

如果可以从feed.next()函数传递限制，那将很容易，但我没有发现任何有效的方法。

谁能帮我？

谢谢。

4

1 回答 1

0

您应该将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 客户端处于Sandbox Mode，无论您设置什么，您的调用都限制为 20 个项目limit，因此这可能对您影响不大。

于 2016-09-16T17:07:10.823 回答