Блог

Я пытаюсь создать приложение, которое позволит мне обновлять текстовое поле после получения изменения переменной. Однако обновление переменной занимает много времени, и await не работает, чтобы дождаться обновления моей переменной, вероятно, из-за функции тайм-аута, которую я использовал. Как мне создать прослушиватель или что-то в этом роде, чтобы проверять наличие изменений переменных?

Ниже приведен мой фрагмент кода

 const [banana, setBanana] = useState(-1);
  const updateLocation = async() => {
    const majorSig = scheduledScan();
    setBanana(majorSig);
  }

  const scheduledScan = async() => {
  beaconScan();

  // Scans for 20 seconds
  setTimeout( async()=> {
    beaconStop();
    await getAndUpdateUserLoc();
    // console.log("Loggged: ", await getUserLoc());
    // console.log("major: ", await getSignificantMajor());
    currentMajor = await getSignificantMajor();
    return currentMajor;
  }, 20000);
}
  

Когда я запускаю UpdateLocation(), мой код должен выполняться в течение 20 секунд. Я хочу, чтобы он подождал, пока не завершит выполнение scheduledScan() и вернет значение в majorSig, прежде чем запускать функцию setState . Однако прямо сейчас все, что он делает, это запускает scheduledScan() и немедленно обновляет setState до неправильного значения. Что я должен сделать, чтобы заставить его вести себя так, как я хочу?
Спасибо.

Во-первых, в вашей функции async UpdateLocation отсутствует оператор await. Давайте добавим это соответствующим образом:

 const updateLocation = async () => {
  const majorSig = await scheduledScan();
  setBanana(majorSig);
};
  

Тогда было бы неплохо, если бы вы придерживались подхода promise в своей функции с ограниченным временем, используя a Promise.race , который позволяет вашей функции либо истекать, либо успешно возвращать значение:

 const scheduledScan = async () => {
  beaconScan();
  return Promise.race([
    async () => {
      beaconStop();
      await getAndUpdateUserLoc();
      // console.log("Loggged: ", await getUserLoc());
      // console.log("major: ", await getSignificantMajor());
      currentMajor = await getSignificantMajor();
      return currentMajor;
    },
    new Promise((_, reject) => setTimeout(() => reject(new Error('Request timed out')), 20000)),
  ]);
};