将呈现为Marionette集合视图的项目动画化为

我有一个集合，其中包含表示应用程序导航项目的模型。在我的应用程序中，导航位于屏幕的左侧，我希望能够在渲染时逐个滑动导航项目。导航容器是一个集合视图，导航项是它的项目视图。将呈现为Marionette集合视图的项目动画化为

在集合视图中，我已将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中滑动它，它应该工作。不幸的是，这不起作用，导航项目已经出现在屏幕上，没有动画。我在这里做错了什么，有没有人知道为什么这似乎不工作？我在想我的应用程序的另一部分可能存在错误，但是如果是这种情况，并且如果这是固定的，上面的代码应该工作吗？

来源

2013-05-04 Gabe H

也许尝试这样的事：

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

这将直接对项目的类，然后滑动时，它是由的CollectionView呈现的项目视图（OnRender将被自动调用科幻它的定义，有没有别的事要你做）。

来源

2013-05-06 07:34:12

但最初当呈现集合视图时，它不会附加到dom，所以他不会看到过渡效果。只有当稍后在集合上触发添加事件（即将集合视图附加到dom后）时，可以看到这个转变 – deven98602 2013-05-06 09:32:11

将呈现为Marionette集合视图的项目动画化为

回答

相关问题