Meteor JS 在 mongodb.find() 之后执行 JQuery

Question

我正在使用流星 js，现在我遇到了问题。

我想从我的 mongodb 中找到一些对象，然后我想执行一个 jquery 函数。

问题是 find() 方法被异步调用，所以在模板从 db 获取数据之前调用了 jquery 函数。

那我该怎么办？

Template.dashboard.onRendered( function() {
//--- Slick Init ------
    $('.carousel').slick({
        infinite: false,
        dots: false,
        draggable: false,
        arrows: false,
        slidesToShow: 5,
        slidesToScroll: 1,
    });
})

Template.dashboard.helpers({

    devices() {
        return Devices.find({})
    }
})

Answer 1

在 Meteor 中，如果您想在订阅完成或 .find 返回数据时初始化插件，则应遵循以下模式。

Template.listing.onRendered(function () {
  var template = this;

  // Subscribe to data
  template.subscribe('listOfThings', () => {
    // Wait for the data to load using the callback to subscribe

    // Execute​ your collection .find()

    Tracker.afterFlush(() => {
      // Use Tracker.afterFlush to wait for the UI to re-render
      // then initialize your jquery component

      // Initialization code here
    });
  });
});

如果您正在初始化的组件不依赖于直接执行.find()，而是依赖于您的模板首先运行帮助程序，那么您将遵循非常相似的模式。唯一的区别是您根本不会执行.find()。

Template.listing.onRendered(function () {
  var template = this;

  // Subscribe to data
  template.subscribe('listOfThings', () => {
    // Wait for the data to load using the callback to subscribe

    Tracker.afterFlush(() => {
      // Use Tracker.afterFlush to wait for the UI to re-render
      // (this will ensure your ui has already executed its template helper),
      // then initialize your jquery component

      // Initialization code here
    });
  });
});

显然，您需要更改上述代码以使用您的特定模板名称和订阅名称。这只是为了描述您将遵循的特定模式。

我还建议您查看Blaze API manual，它提供了其他一些不同的订阅模式，例如这个。