我们如何捕获LayersControl组件的更改事件？
我们如何捕获LayersControl组件的更改事件？
提问于 2020-06-02 14:29:58
例如，当更改基本层(单选按钮)或切换覆盖开/关(复选框)时，我们如何捕获更改事件以更新应用程序中状态的其他方面。提前感谢，对任何类型的解决方案都持开放态度。伪代码：
<Map>
<LayersControl position='topright' change={this.handleLayerControlsChange}>
<BaseLayer checked name='Map 1'>
<TileLayer url={map1} />
</BaseLayer>
<BaseLayer checked name='Map 2'>
<TileLayer url={map2} />
</BaseLayer>
<Overlay name='Overlay 1'>
<LayerGroup>
<GeoJSON data={overlayData1} />
</LayerGroup>
</Overlay>
<Overlay name='Overlay 2'>
<LayerGroup>
<GeoJSON data={overlayData2} />
</LayerGroup>
</Overlay>
</LayersControl>
</Map>Stack Overflow用户
发布于 2020-06-02 14:56:22
当然..。一小时又一小时，只有在发布了一个问题之后，才能找到解决方案。这个映射有一个whenReady事件(我已经在使用它了，只是它不在伪代码中)，在查看Leaflet Docs on the Map Events时，有一个可以使用的baselayerchange。伪代码，这可能会在某些时候帮助其他人：
baseLayerChange = event => {
console.log('baseLayerChange event', event);
}
whenReadyHandler = event => {
const { target } = event;
target.on('baselayerchange', this.baseLayerChange);
}
<Map whenReady={this.whenReadyHandler}>
<LayersControl position='topright' change={this.handleLayerControlsChange}>
<BaseLayer checked name='Map 1'>
<TileLayer url={map1} />
</BaseLayer>
<BaseLayer checked name='Map 2'>
<TileLayer url={map2} />
</BaseLayer>
<Overlay name='Overlay 1'>
<LayerGroup>
<GeoJSON data={overlayData1} />
</LayerGroup>
</Overlay>
<Overlay name='Overlay 2'>
<LayerGroup>
<GeoJSON data={overlayData2} />
</LayerGroup>
</Overlay>
</LayersControl>
</Map>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/62146103
复制相关文章
相似问题
腾讯云开发者
