代码之家 › 专栏 › 技术社区 › Roman Susi

如何在JavaScript中链接两个或三个第三方回调?

javascript

Roman Susi · 技术社区 · 6 年前

web应用程序页包含两个大组件,它们在完全呈现时调用回调。

问题是在两个组件都完全呈现后调用函数。

这可能可以通过使用超时和轮询一些变量来解决,但我想应该有更好的方法。

比如说,我有这样一个例子:

function callMeAfterBothRendered() {...};
libA = libraryA($('.comp1'), {"rendered": function () {...}});
libB = libraryB($('.comp2'), {"rendered": function () {...}});

我找到了一些关于连锁承诺的材料,但不太清楚如何将其应用于这种情况?

一个复杂的问题是,实际上这些库不是在同一个地方直接调用的(如上面简单显示的那样),而是在适配器“类”中更深层次的一些init方法中调用的。

有什么好的解决办法,也可以很容易地推广到3个组成部分?

3 回复 | 直到 6 年前

Fabien Greard 6 年前

使用 Promise.all ,它将等待你每一个承诺的结束。

const onePromise = () => new Promise(resolve => setTimeout(resolve, 1000));
const anotherPromise = () => new Promise(resolve => setTimeout(resolve, 2000));

const loadPromises = (...args) => {
  return Promise.all(args);
};

loadPromises(onePromise, anotherPromise).then(() => console.log('done'));

Daniel A. White 6 年前

承诺是最好的办法。

function callMeAfterBothRendered() {...};
Promise.all([
    new Promise((resolve) => libraryA($('.comp1'), {"rendered": resolve })), 
    new Promise((resolve) => libraryB($('.comp2'), {"rendered": resolve }))
]).then(callMeAfterBothRendered);

Bergi 6 年前

promisify 函数,即创建在呈现组件时实现的承诺。

const libApromise = new Promise(resolve => {
    libraryA($('.comp1'), {"rendered": resolve});
});
const libBpromise = new Promise(resolve => {
    libraryB($('.comp2'), {"rendered": resolve});
});

您可以将这些承诺作为init方法中的值返回,或者将它们存储在适配器类实例中,并将它们传递给其他人,以便最终在某个地方将它们收集到一个数组中:

const promise = [libApromise, libBpromise];

你现在可以使用 Promise.all 要创建一个承诺,当所有承诺都实现时(即当所有组件都呈现时),该承诺将实现:

Promise.all(promises).then(() => {
    console.log("all done!");
    â¦
});

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前

SlickRed · 我无法使用JS关注HTML元素

1 年前

Mayron Guedes · 如果登录名不在本地存储中,如何重定向页面?

1 年前

assembler · Nextjs没有处理发布请求

1 年前

PavelB · 如何使用Seleniumwebdriver和mocha只运行一个测试文件?

1 年前

BADRUM · 执行两个获取功能后,如何导航回页面?

1 年前

Toniq · javascript为php保存多维数组

1 年前

Natalie Smyth · 隐藏类只在我试图切换的两个部分中的一个部分上工作

1 年前

SkyWalker · 在JavaScript中,合并日期-时间序列的有效算法是什么?

1 年前