Question

这是我第一次使用异步js，它没有按预期工作。

以下是有问题的代码的简单形式：

＆＃13;

let input = document.querySelector( '#test' );

document.querySelector( '#btn' ).addEventListener( 'click', getIP );
document.querySelector( '#btn-2' ).addEventListener( 'click', test );

async function test()
{
    let value = input.value;
    if ( !value )
    {
        await getIP();
        value = input.value;
    }
  
    alert( value );

  // do something with `value`
}

function getIP()
{
    fetch( 'https://httpbin.org/get' ).then( res => {
        return res.json();
    }).then( json => {
        input.value = json.origin
    });
}

＆＃13;

<input id="test" type="text" />
<input type="button" id="btn" value="load" />
<input type="button" id="btn-2" value="execute something" />

＆＃13;

此代码假设让用户将其IP加载到框中，然后其他按钮（本例中未显示）可以使用此IP执行操作。

但是，有一个按钮（#btn-2）使用IP执行单个操作。

问题在于我想让用户立即执行#btn-2的操作，而不是点击load按钮。

我怎样才能让它发挥作用？

Answer 1

你实际上只需要来自getIp的承诺：

 function getIP() {
   return fetch( 'https://httpbin.org/get' )
     .then(res => res.json());
 }

然后它就像：

一样简单

  async function test(){
     input.value = input.value || await getIP();    
  }

JS等待不按预期工作

1 个答案: