旧的容器仍然出现几秒钟// // Barba.js v1

Question

我不确定自己做错了什么，但是oldContainer仍然在newContainer出现之后出现几秒钟。

这是我的代码：

Barba.Pjax.start（）; Barba.Prefetch.init（）

var transitionAnimation = Barba.BaseTransition.extend（{     开始：function（）{

Promise
        .all([this.newContainerLoading, this.startTransition()])
        .then(this.fadeIn.bind(this));
},

startTransition: function() {

    var transitionPromise = new Promise(function(resolve) {
        var outTransition = new TimelineMax();


        outTransition

            .to("h1", 1, {
                y: 50,
                autoAlpha: 0,
                ease: Power2.easeOut
            })
            .staggerFromTo("ul li a", 0.7, {
                top: "0",
            }, {
                top: "52",
                autoAlpha: 0,
                ease: Expo.easeOut
            }, 0.1, "-=0.9")


            .to("h6", 1, {
                y: 50,
                autoAlpha: 0,
                ease: Power2.easeOut
            }, "-=0.9")

            .set(".color-wipe", {
                display: 'block',
                y: "100%"
            }, "-=0.7")
            .staggerFromTo(".color-wipe", 1, {
                y: "100%"
            }, {
                y: "-100%",
                ease: Expo.easeOut
            }, 0.2, "-=0.2")

            .to(".loader", 1, {

        autoAlpha: 1,
                onComplete: function() {
                    resolve();
                }
            }, )



            .staggerFromTo(".color-wipe", 1, {
                y: "-100%"
            }, {
                y: "100%",
                ease: Expo.easeIn
            }, 0.2, "-=0.5")
            .set(".color-wipe", {
                display: 'none'
            })


    });


    return transitionPromise;
},

fadeIn: function() {

    $(window).scrollTop(0);

    var _this = this;
    var $el = $(this.newContainer);

    TweenMax.set($(this.oldContainer), {
        visibility: "hidden",
        opacity: 0,
    });
    TweenMax.set($el, {
        visibility: "visible",
        opacity: 0,
    });


    TweenMax.to(".loader", 1, {
        y: -50,
        autoAlpha: 0,
        ease: Expo.easeOut
    });


    TweenMax.fromTo("h1", 1.5, {
        y: 50,
        autoAlpha: 0
    }, {
        delay: 0.8,
        y: 0,
        autoAlpha: 1,
        ease: Expo.easeOut
    });

    TweenMax.to($el, 0.1, {
        opacity: 1,
        onComplete: function() {
            _this.done();
            console.log("done");
        }
    });
    Barba.Dispatcher.on('newPageReady', function(currentStatus, oldStatus, container) {
        eval(container.querySelector("script").innerHTML);
    });
}

}）;

Barba.Dispatcher.on（'newPageReady'，function（currentStatus，oldStatus，barbaContainer，newPageRawHTML）{

if (Barba.HistoryManager.history.length === 1) { // ignore when it's first view
    return;
}

var $body = $('body');

$body.removeClass();

[1]）;

}）;

Barba.Pjax.getTransition = function（）{     / **      *您可以在这里使用自己的逻辑！      *例如，您可以基于当前页面或链接使用不同的过渡...      * /

return transitionAnimation;

};