Question

在我的Meteor应用程序中，我正在尝试从此API加载随机图像，我得到一个类似的JSON：

{
 "id":2026
 "url": "https:// ... " ,
 "large_url":null,
 "source_id":609,
 "copyright":"CC0",
 "site":"unsplash"
}

我是这样做的：

if (Meteor.isClient) {
    Template.body.helpers({
        randomImage: function() {
            Meteor.call("unImage", function(error, results) {
                Session.set('url', results.data.url);
            });
            return Session.get('url');
       }
    });
}

if (Meteor.isServer) {
    Meteor.methods({
        unImage: function() {
            this.unblock();
            return Meteor.http.call("GET", "http://www.splashbase.co/api/v1/images/random");
        }
    });
}

在我的HTML中：

<div class="header" style="background-image: url('{{randomImage}}')">
  ...
</div>

这是有效的，但它每秒重新加载图像 - 或多或少。我想这种情况正在发生，因为服务器端的函数unImage会加载服务器或类似的东西（不确定）;无论如何，我无法阻止它。关于如何解决它的任何想法？为什么会发生这种情况？

Answer 1

这是因为randomImage助手内的会话变量。并且Session variables本质上是反应性的，只要其值发生变化，它就会在块中重新运行。

在这种情况下，辅助代码会一次又一次地重新运行，因此，Meteor方法会一次又一次地被调用

因此，将帮助器中的Meteor.call移动到渲染事件，如下所示

if (Meteor.isClient) {
    Template.body.rendered= function(){
       Meteor.call("unImage", function(error, results) {
          Session.set('url', results.data.url);
       });
    }


    Template.body.helpers({
        randomImage: function() {
            return Session.get('url');
       }
    });
}

一旦模板准备就绪，应该调用Meteor方法并设置url变量，从而重新运行助手randomImage并获得相同的值

Meteor HTTP调用不断加载图像

1 个答案: