Javascript Barba.js转换多个页面

我正在Barba.js上做实验。我想做的是，当从一个页面转换到另一个页面时，我想先看到3个彩色页面的动画作为画布效果加载。不幸的是，只有第一个画布在加载时发生，而其他三个画布不存在。我在main.js中尝试了几个组合，我向您展示其中的一个

你可以现场观看

---

如何以不同的延迟运行加载屏幕一、加载屏幕二和加载屏幕三，然后使用barba.js一个接一个地运行？

如果我理解正确，您的页面转换包括一些覆盖更改颜色3次，但它只更改颜色一次

如果是这样的话，我认为问题在于您在1000毫秒后已经在调用

done（）

，因为您第一次调用

wait delay（1000）

。调用done基本上会告诉Barba下一个页面可以加载到DOM中，而

leave（）

中的其余代码可能不会被执行。

这对我很有用

transitions: [{
    name: 'transition-name',
    async leave(data) {
        const done = this.async();

                changePage();
                await delay(1000);
                done()
    },
    async enter(data) {
        
    //    return enterAnimation()
    }
  }]

---

解释它是如何为你工作的，给出一些细节

transitions: [{
    name: 'transition-name',
    async leave(data) {
        const done = this.async();

                changePage();
                await delay(1000);
                done()
    },
    async enter(data) {
        
    //    return enterAnimation()
    }
  }]