如何在 javascript 中进行多个 async/await -答案

【问题标题】：how make multiple async/await in javascripts -如何在 javascript 中进行多个 async/await -
【发布时间】：2022-01-19 17:26:07
【问题描述】：

我需要执行一个函数作为另一个函数（如链）的结果。我在下面解释了我的代码的详细信息。

const setter = async () => {
  //this my first request that puts data in property value work right and get data.
  setPropertyvalue(await (getpropertvalue(slide.slide, 0)));

  const lat2 = parseInt(await return_value(propertyvalue, "geolocation_lat"));
  //upper two const lat2&long2 depend on setpopertyvalue
  const long2 = parseInt(await return_value(propertyvalue, "geolocation_long"));   

  setTimeout(() => { //and this code is running after all/ I consider time
    setGeo({ ...geo, lat: lat2, long: long2 });
  }, 2000);

};

setter(); // put this function in onload event

我的问题 = 代码的第二部分不能正常工作，它们只返回 NAN 值 - 我认为它们在第一部分之前运行，但我需要在第一部分之后运行这些代码；

【问题讨论】：

标签： javascript reactjs asynchronous async-await react-hooks

【解决方案1】：

您实际上不需要将propertyValue 设置为此处的状态，只需在下一个异步调用中使用它即可。这里也不需要setTimeout，整个功能可以简化如下：

const setter = async () => {
  const propertyValue = await getpropertvalue(slide.slide, 0);

  const lat2 = await return_value(propertyValue, "geolocation_lat");
  const long2 = await return_value(propertyValue, "geolocation_long");

  setGeo({ ...geo, lat: parseInt(lat2), long: parseInt(long2) });
};

【讨论】：

我明白了——首先我应该将数据放入 const 然后过滤它

【解决方案2】：

出于性能原因，更新React state 的过程是异步的。这就是为什么感觉变化不会立竿见影的原因。

试试这个代码对你有帮助

const setter = async () => {
  let proertyVal = await (getpropertvalue(slide.slide, 0))
  setPropertyvalue(proertyVal)

  const lat2 = parseInt(await return_value(proertyVal, 'geolocation_lat'))
  const long2 = parseInt(await return_value(proertyVal, 'geolocation_long'))
  //upper two const lat2&long2 depend on setpopertyvalue

  setTimeout(() => { //and this code is running after all/ I consider time
    setGeo({ ...geo, lat: lat2, long: long2 })
  }, 2000);

}
setter(); // put this function in onload event
  }

【讨论】：

【解决方案3】：

propertyvalue 的值是在您调用const [propertyvalue, setPropertyvalue] = useState() 时分配的。

您的 setter 函数已关闭该变量。

下次渲染组件时，您将拥有一个新的 propertyvalue 变量，其中包含状态中的最新值，但这对您没有帮助。

await (getpropertvalue(slide.slide, 0)) 为您提供所需的值，因此将其存储在局部变量中并使用它。

const updatedPropertyvalue = await (getpropertvalue(slide.slide, 0));
setPropertyvalue(updatedPropertyvalue);
// continue to use updatedPropertyvalue in the rest of the function

【讨论】：

哇，那个愚蠢的虫子 - 让我的一整天 TNK U

【解决方案4】：

好的 promises 应该更有效，promise 每个函数都必须解决才能让下一个函数起作用。

async function todos(){
 await(fetch({url:'',method:''})).
 then((res)=>{}).
 then((res)={}).
 catch((err)=>)
}

【讨论】：

他们正在使用承诺。他们没有使用fetch