如何反应性地渲染自己的对象实例? (不是光标obj)

时间:2014-08-12 04:01:58

标签: javascript mongodb meteor iron-router

我正在尝试构建一些在流星中应该是一个相当明显的代码模式的东西,但感觉我必须做错了,因为反应性让我咬了一脚。

我想创建自己的Object实例,然后将其传递给要呈现的模板。随着对象内部状态的改变,模板应该反复更新。

所以例如玩家进入页面,我想创建这个对象的一个​​实例。它不是mongo find或光标,而是我自己的类。

理想情况下,我会在路由器中创建类似onRun()事件的对象,然后将该对象传递给要呈现的数据。

以下允许我获取对象,但在内部状态更改时不会更新模板。

如果我将对象放入Session中,我会得到:

Uncaught RangeError: Maximum call stack size exceeded ejson.js?

通过将其粘贴到路由器的@params中,我可以将它从onRun传递给数据,但这看起来像是黑客。

还有另一种更好的方法来创建自己的对象类型,然后将其传递给模板以进行反应性渲染吗?或者我是否需要深入研究Deps.autorun()并设置自己的Deps跟踪以实现这么简单的工作?

  @route 'magnets',
    path: '/magnets/lesson/:lessonCname/:subTopic?'
    waitOn: ->
      Meteor.subscribe('MagnetsQuery', {lessonCname: @params.lessonCname}, {} )

    onBeforeAction: ->
      console.log("onRun")
      if @ready()
        if @params.deck
          console.log('already had a deck')
        else
          deck = new DialogDeck(@params.lessonCname)
          Template.magnets.deck = deck
          console.log('created deck', deck)
          @params.deck = deck

    data: ->
      obj = {
        deck: @params.deck
        lessonCname: @params.lessonCname
        subTopic: @params.subTopic
      }
      console.log('data', obj)
      return obj

1 个答案:

答案 0 :(得分:2)

您可以将Deps.Dependency合并到DialogDeck中,使其成为被动数据源。有关如何执行此操作的优秀教程here

完成后,请在模板created功能中创建deck。与onBeforeAction铁路由器钩子不同,这不是被动的,因此deck只会被创建一次。

以下是使用单个Dependency表示整个DialogDeck对象的简单示例。

function DialogDeck (lessonCname) {
  this.lessonCname = lessonCname;
  this.dep = new Deps.Dependency;
};

var deck;

Template.magnets.created = function () {
  deck = new DialogDeck(this.data.lessonCname);
};

Template.magnets.deck = function () {
  deck.dep.depend();
  return deck;
};

Template.magnets.events({
  'click button': function () {
    deck.lessonCname = 'something different';
    deck.changed();
  }
});

当然,您可以使用更多依赖项来在呈现模板时获得更大的粒度。