3

Ember アプリでは、DOM から動的に挿入または削除される多くのカスタム ビューを使用しています。

ビューが挿入または削除されたときにスムーズな jquery アニメーションを使用したいことを除いて、すべて正常に動作します。たとえば、次のビューがあります。

<div id="container">
    {{#if App.slideShow}}
        {{view App.SlideShowView}}
    {{/if}}
</div>

通常、コンテナの高さは 0px で、ビューの高さに合わせて変化します。ビューが挿入されると、突然発生します。次のようなものが欲しいです：

$('#container').slideDown(300);
//now the view should became visible

ビューが削除されたら、次のようにしたいと思います。

//the view becomes invisble
$('#container').slideUp(300);

Ember でこの種のアニメーションを設定する最良の方法は何ですか?

4

3 に答える 3

0

とフックをApp.SlideShowView使用して、アニメーションをトリガーできます。おそらく、ビューのメイン DOM 要素でアニメーションをトリガーしたいと思うでしょう。didInsertElementwillDestroyElement

App.SlideShowView = Ember.View.extend({
  didInsertElement : function(){
    this.$().slideDown(300);
  },
  willDestroyElement : function(){
    this.$().slideUp(300);
  }
});

もう 1 つのオプションは Ember Animated Outlet ですが、実際にはルートからルートへの遷移をアニメーション化することを目的としています。あなたはこの「The Ember Way」を実際に行っていないように見えるので、あなたには合わないかもしれません。

https://github.com/billysbilling/ember-animated-outlet

于 2013-09-26T06:25:39.507 に答える