Asyn c и ждать вызова в firebase не ждет

Question

У меня есть приложение, похожее на знакомство, и я хочу иметь возможность запрашивать новые совпадения каждый раз, когда пользователь нажимает кнопку вкладки «соединение».

Я не уверен, неправильно ли я пишу await или asyn c, но если пользователь перемещается слишком быстро, чтобы база данных возвращала результаты, возвращаемые совпадения загружаются недостаточно быстро. До сих пор у меня было следующее: при загрузке страницы, которую я вызываю в Firebase, когда пользователь уходит, а затем возвращается обратно на вкладку «соединение», я возвращаюсь в Firebase. метод getMatches() является вызовом для firebase.

const MatchesScreen = ({navigation}) => {
  const {state, updateDislikedQueue, updateLikedQueue, getMatches} = useContext(AuthContext);
  const [loaded, setLoaded] = useState(false);
  const [queue, setQueue] = useState({});
  const [noMatches, setNoMatches] = useState(false);
  const [updateProfileAndPreferences,setUpdateProfileAndPreferences] = useState(false);

const getMatchesMethod = async () => {
    getMatches().then(matches => {
      if (!matches) {
        Alert.alert("Update Preferences and Profile before connecting");
        setUpdateProfileAndPreferences(true);
      } else {
        setUpdateProfileAndPreferences(false);
        let cardData = [];
        for (m in matches) {
          if (matches[m].id == state.id) {
            continue;
          } else {
            let user = {
              id: matches[m].id,
              fullName: matches[m].info.fullName
            };
            cardData.push(user);
          }
        }
        if (cardData.length > 0) {
          setQueue(cardData);
          setLoaded(true);
        } else {
          setNoMatches(true);
          Alert.alert("No Connections Available");
        }
      }
    });
  };

  useEffect(() => {
    getMatchesMethod();
    const unsubcribe = navigation.addListener("willFocus", () => {
      getMatchesMethod();
    });
    // return unsubcribe.remove(); 
  }, []);

Также, когда я пытаюсь отписаться, слушатель не работает, когда пользователь перемещается назад и вперед. Любая помощь в том, что я делаю не так с вызовами asyn c и слушателем, будет принята с благодарностью.

Answer 1

Я рекомендую использовать ключевое слово await перед getMatches () вместо синтаксиса .then (). Это делает код читаемым более синхронно, и это может помочь предотвратить ошибки. Await всегда должен вызываться из асинхронной функции. Он не может быть вызван из не асинхронной c функции.

Я думаю, вам также нужно будет использовать await перед getMatchesMethod ();

Ознакомьтесь с этой статьей для получения справки о вызове асинхронных код внутри useEffect () https://medium.com/javascript-in-plain-english/how-to-use-async-function-in-react-hook-useeffect-typescript-js-6204a788a435

Пример:

const unsubcribe = navigation.addListener("willFocus", async () => {
    await getMatchesMethod();
});

Answer 2

Я думаю, вы просто забыли ключевое слово await в своей функции. Все время случается со мной ахаха

Answer 3

Я нашел проблему. Я был на V3 реакции-навигации, которая сильно устарела, была в конфликте с моей реакцией-нативной и выставочной версиями.

Я нахожусь в процессе обновления всего (RN> .60, EXPO sdk> 35, @ реагировать на навигацию V5) и смогу использовать слушатели для @ реагировать на навигацию v5 на моем getMatches () способ.