如何监听react-leaflet地图的图层控制事件

import { Map, TileLayer, LayersControl } from 'react-leaflet';

const { BaseLayer, Overlay } = LayersControl;

// ...

function MapComponent() {
  return (
    <Map center={[51.505, -0.09]} zoom={13}>
      <LayersControl>
        {/* 在这里添加图层组件 */}
      </LayersControl>
    </Map>
  );
}

<BaseLayer checked name="基本图层">
  <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
</BaseLayer>

<Overlay checked name="叠加图层">
  {/* 在这里添加叠加图层 */}
</Overlay>

<BaseLayer checked name="基本图层" onAdd={handleAdd} onRemove={handleRemove}>
  <TileLayer url="https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png" />
</BaseLayer>

<Overlay checked name="叠加图层" onAdd={handleAdd} onRemove={handleRemove}>
  {/* 在这里添加叠加图层 */}
</Overlay>