Не работает после переключения вида

У меня проблема с react-native при переключении представлений с помощью react-native-router-flux.

    mapMarkerGen(){
     if(mapMarkersFetched){
     _this = this;
     return mapMarkers.map(function(marker, i){
    return(
    <MapView.Marker
      key={i}
      coordinate={{
        longitude: parseFloat(marker.lo),
        latitude: parseFloat(marker.la),
      }}
      onPress={() =>{_this.getMarkerInfo(marker.id, i);}}
      title={_this.state.title}
      description={_this.state.info}
      onCalloutPress={function(){Actions.place({placeID: marker.id});}}
    >
    </MapView.Marker>
  );
  });
}
}

После того, как я переключаюсь между представлениями, если я нажимаю выноску и возвращаюсь, я получаю сообщение об ошибке _this.getMarkerInfo не является функцией

"реагировать": "^16.0.0-альфа.12",

"реагирующий-родной": "^0.45.1",

"реагирующий поток-маршрутизатор": "^ 3.40.1"


react-native android javascript react-native-router-flux
person Carel155    schedule 17.06.2017    source источник
comment
Как вы называете mapMarkerGen? Правильно ли привязан this?   -  person Marko Gresak    schedule 18.06.2017
comment
mapMarkerGen вызывается из другой функции, например: {this.mapMarkerGen()}   -  person Carel155    schedule 18.06.2017
comment
Является ли вызов внутри функции, область действия которой this отличается от того, что вы ожидаете в опубликованном коде? Лучший способ действий — связать функцию внутри конструктора и всегда вместо этого вызывать связанную. Вы можете сделать что-то вроде this.mapMarkerGen = this.mapMarkerGen.bind(this), и каждый вызов mapMarkerGen теперь будет иметь правильную ссылку this, независимо от того, где он вызывается.   -  person Marko Gresak    schedule 18.06.2017
comment
Я добавил this.mapMarkerGen = this.mapMarkerGen.bind(this) в конструктор и не изменил никакого кода, но в настоящее время он ничего не изменил. Из функции, в которой я вызываю mapMarkerGen, я установил _this = this; а затем вызовите {this.mapMarkerGen()}   -  person Carel155    schedule 18.06.2017
comment
Использование _this = this не поможет, если исходная ссылка this неверна. Поскольку код отсутствует, я не могу сказать, что может быть не так. Я предлагаю вам проверить, нет ли опечаток в определении или вызове getMarkerInfo. И посмотрите, доступно ли оно там, где вы определяете _this = this, и работайте оттуда. Кстати, почему вы определяете _this как глобальное, а не локальное для mapMarkerGen? Возможно, вы где-то перезаписали значение _this и сломали что-то.   -  person Marko Gresak    schedule 18.06.2017
comment
Я также предлагаю вам писать функции, используя оператор стрелки вместо function, и позволить виртуальной машине (или, альтернативно, компилятору, такому как babel) обрабатывать привязку правильной ссылки this.   -  person Marko Gresak    schedule 18.06.2017
comment
Проблема заключалась в том, что я определял _this как глобальный, а не локальный. Спасибо за помощь!   -  person Carel155    schedule 18.06.2017
comment
Np :) В будущем я бы посоветовал вам установить линтер, такой как Eslint, который должен помочь в отлове ошибок как это. Я также опубликую это решение в качестве ответа, чтобы другим читателям не нужно было читать эти комментарии.   -  person Marko Gresak    schedule 18.06.2017

Ответы (1)


arrow_upward
0
arrow_downward

Проблема в том, что вы определяете _this = this как глобальную переменную. Есть вероятность, что вы перезапишете значение, и когда вы захотите получить к нему доступ внутри обратного вызова onPress, значение указывает на другую ссылку this, которая не определяет вызываемую функцию.

Чтобы исправить это, замените вышеупомянутый код на: const _this = this;

Я бы предложил использовать функцию стрелки ES2015, как вы делаете с обратным вызовом onPress, где вам не нужно обрабатывать эту ссылку самостоятельно.

person Marko Gresak    schedule 17.06.2017