Реагировать: Не удается обновить фрагмент состояния, но другие свойства состояния работают нормально

# #javascript #react-native #google-cloud-firestore #state

Вопрос:

Используя эти две части государства:

 this.markerArray = [];
this.arrayLength = 0;
 

Я пытаюсь использовать эту функцию:

 getMarkers = () => {
  this.dbRef.get().then((snapshot) => {
    snapshot.docs.forEach((marker) => {
      if (!this.markerArray.includes(marker.id)) {
        let currentID = marker.id;
        let appObj = {
          ...marker.data(),
          ["id"]: currentID,
        };
        this.markerArray.push(appObj);
      }
    });

    this.setState({
      markerArray: this.markerArray,
    });
    // (problem code) this.setState({arrayLength: this.markerArray.length})

    return this.markerArray;
  });
};
 

Чтобы обновить список маркеров карты. Я пытаюсь обновить этот файл.arrayLength, когда длина этого файла.markerArray изменится. Я думаю, что проблема связана с асинхронной природой setState, но я не могу понять, что делать с этой информацией.

Я пытался:

  1. Создание отдельной функции для установки длины массива
  2. Передача этой функции в качестве обратного вызова при настройке состояния markerArray
  3. Вызов функции в режиме визуализации (бесконечный цикл)
  4. Установка длины массива в том же состоянии набора, что и markerArray
  5. Изменение начального значения длины массива на null, 0 и «

Я даже попытался установить arrayLength на произвольное число, которое не зависит от markerArray.length, но оно не обновляется.

Комментарии:

1. Есть ли причина, по которой вы не можете просто избавиться от this.arrayLength всего вместе и просто использовать this.marketArray.length напрямую?

2. Я пытался провести сравнение, чтобы позже использовать условное выражение для запуска getMarkers() один раз, не вызывая бесконечного цикла. Условное условие выглядит так (если this.arrayLength !== this.marketArray.length) { getMarkers() (или setState. (Длина массива: this.marketArray.length}. Я понимаю, что есть проблемы с вызовом setState в render (), но я пытался их обойти.

3. Я тебя понял. Ну, я не уверен, что у меня есть ответ на этот вопрос, но я просто выбросил его на тот случай, если ответ был таким простым. Одну вещь я вижу: ваша getMarkers функция кажется асинхронной ( .get().then()... ), но она не помечена как синхронизированная. Попробуй getMarkers = async () => {...} для начала.

4. Я попробовал пару разных асинхронных настроек. Честно говоря, я думаю, что это из-за того, как я настроил опору arrayLength, но я не знаю, что с ней не так. Он не будет обновляться ни при каких обстоятельствах