Question

我有一个状态机，每当使用currentViewBinding输入新状态时，我使用新的currentViewBinding来交换整个containerView的部分：

  index: Ember.State.create({
    enter: function(manager) {
      App.get('appController').set('feedView', Ember.View.create({
        templateName: 'dashboard_feed',
        contentBinding: 'App.feedController.content',
        controller: App.get('App.feedController')
      }));
    }
  })

此时，这些视图的渲染速度很慢。有没有办法可以将视图保留在内存中，并避免每次进入状态时重新渲染？

Answer 1

我实际上为StackOverflow上的另一个问题提供了一个解决方案，但它在这里也非常相关。 Avoiding re-rendering of a flash object from scratch when view is reactivated

这是jsFiddle：http://jsfiddle.net/EE3B8/1

我使用一个标志扩展ContainerView，以阻止它在销毁时销毁currentView。您希望将视图实例存储在不会被销毁的地方。

App.ImmortalContainerView = Ember.ContainerView.extend({
    destroyCurrentView: true,

    willDestroy: function() {
        if (!this.destroyCurrentView) { this._currentViewWillChange(); }
        this._super();
    }
});

App.immortalView = Ember.View.create({
    template: Ember.Handlebars.compile(
        'I WILL LIVE FOREVER!'
    )
});

Answer 2

您可以扩展Ember.ContainerView以显示/隐藏其currentView视图，如下所示：

App.FastContainerView = Ember.ContainerView.extend({
  toggleCurrentViewFast: true,

  _currentViewWillChange: function() {
    var childViews = this.get("childViews"),
        currentView = this.get("currentView");

    if (this.toggleCurrentViewFast && childViews.indexOf(currentView) >= 0) {
      currentView.set("isVisible", false);
    } else {
      this._super();
    }
  },

  _currentViewDidChange: function() {
    var childViews = this.get("childViews"),
        currentView = this.get("currentView");

    if (this.toggleCurrentViewFast && childViews.indexOf(currentView) >= 0) {
      currentView.set("isVisible", true);
    } else {
      this._super();
    }
  }
});

Ember.js - currentViewBinding并在每次视图转换时停止重新渲染

2 个答案: