当已经单击元素时，不会触发onClick

Question

我正在使用react-leaflet，并且想在单击矢量要素图层时为其设置样式。有点工作。当我第一次单击某个功能时，会调用click函数，并且会记录yay - clicked。单击另一个尚未选择的功能也会记录yay - clicked。但是，一旦我单击了之前单击的功能，因此应用了样式selectedStyle，就不再调用click函数。 yay - clicked未记录。为什么会这样？

import L from 'leaflet'
import { GridLayer } from 'react-leaflet'

const normalStyle = {
  color: 'black',
}

const selectedStyle = {
  color: 'red',
}

export default class Foo extends GridLayer {

  createLeafletElement(props) {
    let layer = L.vectorGrid.protobuf(props.url, {
      vectorTileLayerStyles: { berlin_flur: defaultStyle },
      subdomains: "",
      key: 'foo',
      interactive: true,
      maxNativeZoom: 16,
      debug: false,
      zIndex: props.zIndex,
      getFeatureId: (f) => {
        return f.foo.bar;
      }
    })

    layer.on('click', function (e) {
      console.log('yay - clicked')
      let properties = { ...e.fooBar.properties }
      if (...)) {
        layer.setFeatureStyle(foo.bar, normalStyle);
      } else {
        layer.setFeatureStyle(foo.bar, selectedStyle);
      }
    });

    return layer
  }
}