4

我构建了我的第一个 Meteor 应用程序，我喜欢它。除了，现在它有真实的生产数据，它有点慢。我收到报告说“当我单击此按钮时没有发生任何事情”。

有没有办法在模板重绘期间显示加载消息，以便用户知道发生了什么事？

为了进一步说明，请查看此模板（不是我的实际代码，仅为简单起见）：

Template.all_posts.posts = function() {
  return Posts.find({'category_id': Session.get('current_category')});
}

因此，如果打开我的控制台并运行Session.set('current_category', 1)，假设运行计算和重绘模板需要 2 秒。我想在那 2 秒内显示一个加载指示器。

需要明确的是，我已经知道如何显示加载指示器。事实上，我已经在初始页面加载时执行此操作，并在我所有订阅为ready(). 我只是想知道在哪里应用相同的逻辑（显示和隐藏加载图标），以便每次重绘模板时都会发生这种情况。伪代码可以正常工作：

简而言之，当 Meteor 忙时，我想反映这一点。

任何帮助是极大的赞赏！

2013 年 10 月 9 日编辑：

从文档...

这些 Meteor 函数将您的代码作为响应式计算运行：

  • 模板
  • Meteor.render 和 Meteor.renderList
  • 自动运行

我认为一种可能的解决方案可以从在这些“计算”中的任何一个无效时显示加载指示器开始。

例如，如果您的代码在 内部运行Deps.autorun，则计算实例作为第一个参数传递，您可以将回调传递给它的onInvalidate方法，如下所示：

Deps.autorun(function(computation) {

  // do reactive stuff

  computation.onInvalidate(function() {
    // display loading indicator
  });
});

但是，据我所知，您不能在其他 Meteor 方法中访问计算对象，只有Deps.autorun.

至于隐藏加载指示器，我认为最好的办法是在最后一个模板的rendered回调中进行，因为计算无效而被（重新）渲染。

有人对此有任何见解、建议、技巧、技巧等吗？

4

2 回答 2

0

以防万一您从未解决此问题，我想分享另一位用户的解决方案，他将其作为我问题答案的一部分发布。由 nate-strauser在这里回答：

挂钩到集合的 .ready() 方法以确定何时可以显示它。当所有数据都加载到客户端时，这将返回 true。您看到的是空的，然后是部分的，然后是完整的渲染，因为您的代码没有等待所有数据，而是在数据到达时渲染。这不是一件坏事，但并不总是可取的。您可以使用类似https://github.com/oortcloud/unofficial-meteor-faq#how-do-i-know-when-my-subscription-is-ready-and-not-still-loading的方式推出自己的解决方案，但我建议对有问题的路线使用带有 waitOn 功能的 Iron-router https://github.com/EventedMind/iron-router#waiting-on-subscriptions-waiton，当它与 loadingTemplate 选项结合使用时，您可以在加载时发出漂亮的 (Loading....) 消息，然后立即过渡到完全填充的模板

您可以忽略全部部分。

于 2014-03-11T03:56:03.163 回答
0

您可以使用Template.myTemplate.created = function ( ) { ... }，如流星文档中所述。您可能可以在创建模板时运行一些 jQuery，并在正文中添加一个加载类，然后Template.myTemplate.rendered删除加载类？

于 2013-10-08T19:05:05.883 回答