0

我有一个包含代表应用导航项的模型的集合。在我的应用程序中,导航位于屏幕左侧,我希望能够在呈现导航项时一一滑动。导航容器是一个集合视图,导航项目是它的项目视图。

在集合视图中,我已将appendHtml方法更改为如下所示。

    appendHtml: function (collectionView, itemView, index) {
            console.log('APPENDING ITEM VIEW', itemView.el);
            itemView.assignNewlyCreated();
            collectionView.$el.append(itemView.el);
            itemView.slideIn();
    },

项目视图具有以下相关方法:

    // Label the dom element as newly created
    assignNewlyCreated: function () {
        this.$el.addClass('newly-created');
    },

    // Slide in the item.
    slideIn: function () {
        console.log('sliding in element', this.el);
        this.$el.animate({left: 0});
    }

由于新创建的类具有将项目从屏幕推到左侧的样式,因此我在想,如果我像这样附加它,然后在它进入 DOM 后将其滑入,它应该可以工作。不幸的是,这不起作用,导航项目已经出现在屏幕上,没有动画。我在这里做错了什么,有谁知道为什么这似乎不起作用?我认为我的应用程序的另一部分可能存在错误,但如果是这种情况并且如果已解决,上述代码是否可以工作?

4

1 回答 1

0

也许尝试这样的事情:

MyItemView = Backbone.Marionette.extend({
  template: "#template",
  className: "newly-created",
  onRender: function(){
    this.$el.animate({left: 0});
  }
});

这会直接在项目上设置类,然后在 CollectionView 呈现项目视图时滑动项目视图(onRender 会自动调用,因为它已定义,您无需执行其他操作)。

于 2013-05-06T07:34:12.000 回答