Мой код выбирает geojson из Rest API, поэтому изначально элемент данных является пустым массивом.
<LayersControl position="topright">
...
<Overlay name="Areas">
<GeoJSON color="purple" key={this.state.key} data={this.state.data} onEachFeature={this.onEachFeature} />
</Overlay>
...
</LayersControl>
Когда обещание API завершается, я устанавливаюState () как для данных, так и для ключа, чтобыПринудительное обновление.
fetch(
"https://...."
)
.then(response => response.json())
.then(data => {
this.setState({ data: data['features'], key: new Date().getTime() });
});
Это все работает.Тем не менее, я получаю вторую запись в LayersControl.
Я попытался выполнить remove () для слоя с помощью ссылок на Overlay - не сработало. Также попытался выполнить remove () для leafletElement с помощью ссылки на элемент GeoJSON - также не сработало
Во втором слое GeoJSON для свойства ключа используется подход хэширования (данных), который также не работает.
Есть ли лучший способ для обработки динамически загружаемого GeoJSON или управления слоями