Как обновить позицию маркера без повторного рендеринга карты? Реагировать на родные карты - PullRequest
Новая
       14

Как обновить позицию маркера без повторного рендеринга карты? Реагировать на родные карты

0 голосов
/ 31 августа 2018

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

Как обновить позиции маркера без повторного рендеринга карты? 

 render() {


    return (
   <MapView
   initialRegion={this.state.playerLocation}
   region={this.state.playerLocation}
      style={ styles.map }


      >
       {this.renderMarkers()}

      </MapView>




    );
  }


renderMarkers =()=>{

return(
  this.state.markers.map(marker=>{
    return(
    <Marker
      coordinate = {{
        latitude: marker.lat,
        longitude: marker.long
    }}      
    title={marker.id}
        />

    )



        })




)








}

Ответы [ 2 ]

0 голосов
/ 11 июня 2019

Я использовал предложение Умайра Ахмеда, и оно полностью сработало для меня. Просто создайте условия в shouldComponentUpdate, чтобы обновить MapView и отобразить маркеры, используя другой компонент.

У меня было: 

<MapView
    key="mapView"
    onMapReady={this._onMapReady}
    region={region}
    loadingEnabled
    showsUserLocation
    showsMyLocationButton
    followsUserLocation
    ref={el => this.mapView = el}
    >
    <Markers />
</MapView>

Маркеры - это компонент, который отображает маркеры на карте и обновляется по мере их изменения. Добавление условий shouldComponentUpdate к компоненту «Карта», содержащему атрибуты, гарантирует, что при обновлении маркеров карта не загружается снова полностью.

0 голосов
/ 31 августа 2018

Это очень распространенная проблема в реакции, и для нее есть очень хорошее решение.

Используйте метод жизненного цикла, который называется shouldComponentUpdate

https://reactjs.org/docs/react-component.html#shouldcomponentupdate

Вы можете попробовать извлечь маркеры рендеринга в отдельный компонент, а затем добавить lifeCycle, чтобы все время возвращать значение False. Это было после того, как компонент был смонтирован, он не будет повторно отображаться снова.

Я не уверен, что это вызовет какие-либо регрессии в вашем случае, но если это произойдет, вы можете пропустить опору, которая может вызвать повторную визуализацию в вашем SCU и обновить маркеры, если это необходимо. Это то, с чем вам нужно играть.

...