在react-map-gl上隐藏和显示标记

Question

我在react-map-gl上遇到了隐藏和显示标记的问题。

这是地图部分。

  <MapGL
     {...viewport}
     {...settings}
     mapStyle={mapStyle}
     onViewportChange={this._onViewportChange}
     dragToRotate={false}
     mapboxApiAccessToken={MAPBOX_TOKEN}
     onHover={this._onHover}>
     {this._renderTooltip()}

     {CITIES.map(this._renderCityMarker)}
      {this._renderPopup()}
      <div className="nav" style={navStyle}>
      <NavigationControl onViewportChange={this._updateViewport} />
    </div>

     <ControlPanel
     containerComponent={this.props.containerComponent}
     onClick={this._onStyleChange}></ControlPanel>
 </MapGL>

这是可见性部分。

  _onVisibilityChange(name, event) {
const visibility = {...this.state.visibility, [name]: event.target.checked};
console.log({visibility});
this.setState({visibility});

}

我正在尝试像这样编写onClick函数

<MapGL
     {...viewport}
     {...settings}
     mapStyle={mapStyle}
     onViewportChange={this._onViewportChange}
     dragToRotate={false}
     mapboxApiAccessToken={MAPBOX_TOKEN}
     onHover={this._onHover} onClick = {{CITIES.map(this._renderCityMarker)}}>

不是真的以这种方式工作，否则我犯了一些错误。 有什么办法解决吗？