How to get current zoom in React-Mapbox-GL?

问题

How can i get current zoom of map in react mapbox gl?

Package: https://github.com/alex3165/react-mapbox-gl/tree/0df46b1dcf194cdf140638f653221d8a82f0b195

I have tried on example from "How to start" to use getZoom method on Mapbut it's not working. I have error that Map.getZoom is not a function.

EDIT ================

When i try to access it by refs then i have problem like on screenshot. How to get this .state.map.e which have my getZoom function?

回答1:

The Map you are using is a ReactMapboxGl object which is a wrapper of mapbox-gl-js. You want to call getZoom() on the mapboxgl.Map object.

To use the original Mapbox API use onStyleLoad property, the callback function will receive the map object as a first arguments, then you can add your own logic alongside react-mapbox-gl. [source]

So you can get it from:

<ReactMapboxGl onStyleLoad={ el => this.map = el } />

Then you could use it here:

componentDidMount() {
    const currentZoom = this.map.getZoom();
}

来源：https://stackoverflow.com/questions/47222134/how-to-get-current-zoom-in-react-mapbox-gl