0

我在 Angular js 应用程序中使用Scrollmagic。我的应用程序右侧有一个侧边栏,可以无限滚动。有些部分会粘住特定的时间,然后像下面这样松开

  • A部分进入视野并坚持
  • A部分保持粘性几个像素,然后解开
  • 部分 B 出现并在几个像素后粘住
  • B部分保持粘性几个像素,然后解开,依此类推..

所以实际上我创建了多个场景并将其添加到scrollMagicController。我现在怀疑由于 scrollmagic 保留 DOM 节点而导致内存泄漏,而 devtools 的堆分析器证明了这一点。我知道场景和控制器有一个销毁方法,需要调用它来清理,但我不知道如何销毁多个节点。以下是我尝试过的

var scrollMagicCtrl = new ScrollMagic.Controller();

//create scene dynamically whenever stickyContainerInView event fires
scope.$on('stickyContainerInView', function(event, inViewElement) {    
    new ScrollMagic.Scene({
            triggerElement: someElement, //Selector or DOM object that defines the start of the scene
            triggerHook: 'onLeave', //sets the position of trigger hook w.r.t viewport
            duration: someDuration, //The duration(in pixels) for which the element will remain sticky
            offset: -60 //Offset Value for the Trigger hook position
        })
        .setPin(someContainer)
        .addTo(scrollMagicCtrl);
});

//clean up things on angular's destroy method
$scope.$on("$destroy", function() {    
    scrollMagicCtrl.destroy();
    scrollMagicCtrl = null;
});

我想我只需要调用控制器的销毁方法,它应该会自动销毁添加到它的所有场景,但不幸的是它不能那样工作。

堆分析器分离 DOM 节点树的屏幕截图

关于我应该如何清理事情的任何帮助?

4

0 回答 0