React-Leaflet всегда перерисовывает карту с помощью «MouseMove». ⇐ Javascript

[Гость]

Я хочу отображать географические координаты при движении мыши в моем приложении React. Заметил, что при "Mousemove" карта многократно перерисовывается со всеми объектами с большим количеством. Как я могу предотвратить это и обновлять только координаты?

Вот код:

класс экспорта MapView расширяет компонент { состояние = { лат: 10, долгота: 50, tileName: "", плитки: [], }; MouseMove = () => { const map = useMapEvent("mousemove", (e) => { пусть lon = e.latlng.lng; пусть lat = e.latlng.lat; this.setState({ широта: lat.toFixed(6), lon: lon.toFixed(6), tileName: this.getTileNameSRTM(lon, lat), }); }); }; оказывать() { пусть сам = это; константная матрица = this.props.matrix; функция renderMatrix() { если (матрица !== ноль) { возвращаться ( ); } } функция Масштаб() { const map = useMapEvent("zoom", (e) => { console.log("масштаб"); self.drawTile(карта, сам); }); вернуть self.state.tiles; } функция Пан() { const map = useMapEvent("move", (e) => { console.log("кастрюля"); //self.drawTile(карта, сам); }); вернуть self.state.tiles; } возвращаться ( Просмотр карт Широта: {this.state.lat} Долгота: {this.state.lon}{" "} {this.state.tileName ); } } экспортировать MapView по умолчанию; Исходный код неполный, я опубликовал только затронутые части.