Пересылка ссылок с помеченной картой: undefined не является функцией (рядом с mapRef.animateToRegion) - PullRequest
0 голосов
/ 02 апреля 2020

У меня есть следующий компонент React Native, использующий react-natve-maps для отображения карт. Мне требуется ref для карты, чтобы использовать ее animateToRegion функцию в отдельном компоненте, и поскольку я использую memo React для предотвращения ненужных повторных рендерингов во время дорогой карты dr aws (например, тепловые карты), я Поэтому я также использую forwardRef, поскольку функциональные компоненты не могут иметь ref реквизит.

В итоге я получил следующее:

import React from 'react';
import {
  StyleSheet,
  View,
} from 'react-native';
import {
  MapView,
  Marker,
} from 'react-native-maps';

const MemoMap = React.memo(
  React.forwardRef((props, ref) =>(
    <MapView
      ref={ref}
      initialRegion={{
        latitude: 0,
        longitude: 5,
        latitudeDelta: 0.01,
        longitudeDelta: 0.01,
      }}
      style={StyleSheet.absoluteFillObject}>
      <Marker
        coordinate={{
          latitude: 0,
          longitude: 5,
        }} />
    </MapView>
  )
), () => false);

export default function App() {
  const mapRef = React.createRef();

  const snapToMarker = () => {
    mapRef.animateToRegion({
      longitude: 0,
      latitude: 0,
      longitudeDelta: 0.01,
      latitudeDelta: 0.01,
    })
  };

  return (
    <View>
      <MemoMap ref={mapRef} />
      <Button onPress={snapToMarker} />
    </View>
  );
}

(для простоты я высмеял функцию равенства memo)

Однако ссылка всегда имеет current: null, а не ссылка на карту. Таким образом, нажатие кнопки просто вызывает undefined при вызове события animateToRegion.

Что я могу сделать, чтобы получить требуемую ссылку на карту?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...