AJAX 调用的占位符函数
文章标签
函数
我最近不得不创建一个没有后端端点的用户界面(ui)。重点是使 ui 尽可能具有响应性,以便用户可以知道操作何时正在进行。
这主要意味着当进行 ajax 调用时,ui 应进行指示,并在调用完成时进行相应更新。
为了帮助 ui 的开发,我创建了一个函数来模拟 ajax 调用。该功能能够:
typescript 代码如下(请参阅带有文档字符串的完整代码示例的要点):
export async function delay<t>( timeout: number, probability?: number, result?: t): promise<t> { return new promise<t>((resolve, reject) => { settimeout(() => { if (!probability || probability 1) { resolve(result); return; } const hit = math.random(); if (hit <p>要使用此功能:<br></p><pre class="brush:php;toolbar:false">async function handlebuttonclick() { // update the ui to show a loading indicator. try { // highlight-start // make the call take 3 seconds, with a 10% chance of failure, // and return an array of users. const result = await delay(3000, 0.9, [ { email: 'user1@example.com', username: 'user 1', }, ]); // highlight-end // update the ui when the call completes succesfully. } catch (err: any) { // update the ui when the call fails. }}
相同函数的 javascript 版本如下:
export async function delay(timeout, probability, result) { return new Promise((resolve, reject) => { setTimeout(() => { if ( !probability || typeof probability !== 'number' || probability 1 ) { resolve(result); return; } const hit = Math.random(); console.log(hit, probability); if (hit <p><em>这篇文章首次发表于 cheehow.dev</em></p>