如何获得当前的传单地图缩放级别?

ODL*_*ana 5 javascript leaflet reactjs react-leaflet

我正在尝试实时获取地图的缩放级别,以制作一个将缩放锁定为当前值的按钮。我曾尝试使用 getMapZoom 和 getZoom 但两者都给我一个未定义的值。我想我没有使用正确的参考,但我找不到太多关于它的文档。这是代码:

<Map className="map-layer" 
          center={center} 
          onoverlayadd={this.overlayadd} 
          onoverlayremove={this.overlayremove}
          ondragend={this.zoomChange}
          onzoomend={console.log('Zoom: ' + this.mapRef.leafletElement.getMapZoom())}
          zoom={this.state.zoom}
          ref={this.mapRef}
          preferCanvas={false}
          animate={true}
          scrollWheelZoom={this.state.zoomLock ? false : true}
          doubleClickZoom={this.state.zoomLock ? false : true}
          touchZoom={this.state.zoomLock ? false : true}
          maxZoom={7}
          minZoom={7}

                    >
Run Code Online (Sandbox Code Playgroud)

rad*_*lle 11

在纯传单中,如果您将 map 定义为const map = L.map("map", options)比您刚刚调用的map.getZoom().

在构造函数中this.mapRef = React.createRef() Map 元素中:

    ref={this.mapRef}
    onzoomend={() => console.log(this.mapRef.current.leafletElement.getZoom()}
Run Code Online (Sandbox Code Playgroud)