Mapbox React Native не может получить доступ к методам карты - PullRequest
Новая
       24

Mapbox React Native не может получить доступ к методам карты

0 голосов
/ 31 мая 2018

Это, вероятно, просто, но я запутался в документации между JS Mapbox и React Native Mapbox.Я создаю новый экземпляр карты, импортируя mapbox в мой проект через import Mapbox from '@mapbox/react-native-mapbox-gl'; , а затем в функцию render () загружаю карту через: 

<View style={container}>
    <Mapbox.MapView
        styleURL={Mapbox.StyleURL.Light}
        zoomLevel={12}
        centerCoordinate={[lat, lng]}
        style={styles.container}
        showUserLocation
    >
    {this.renderAnnotations()}
    </Mapbox.MapView>
</View>

Функция renderAnnotations() I 'определяется следующим образом: 

renderAnnotations() {
        return this.state.stations.map((station, index) =>
          <TouchableHighlight onPress={this._map.flyTo.bind(this, station)} key={index}>
            <View ref={component => this._root = component}>
              <StationPoint key={station.id} station={station} />
            </View>
          </TouchableHighlight>
        );
      }

Цель состоит в том, чтобы визуализировать точки на карте с соответствующим событием flyTo onPress.Карта и эти точки отображаются отлично, но событие onpress возвращает:

error "Невозможно прочитать свойство 'flyTo' из неопределенного"

On this учебник, он предлагает вам получить доступ к карте, используя this._map.Это правильно, и я делаю другую ошибку?Или есть альтернативный способ доступа к методам карты?Любая помощь очень ценится!

1 Ответ

0 голосов
/ 31 мая 2018

Разобрался с ответом, на случай если он кому-нибудь поможет.Я не определял свойство ref в MapView.Ссылка должна быть определена как this._map, например: 

<View style={container}>
    <Mapbox.MapView
        ref={(c) => this._map = c}
        styleURL={Mapbox.StyleURL.Light}
        zoomLevel={12}
        centerCoordinate={[lat, lng]}
        style={styles.container}
        showUserLocation
    >
    {this.renderAnnotations()}
    </Mapbox.MapView>
</View>
...