获取Geocoder地址搜索值以更新App.js中的状态使用react-map-gl-geocoder，mapbox-gl和react-map-gl

问题描述

我的应用程序在React中运行。 我已经安装了带有react-map-gl-geocoder，react-map-gl和mapBox-gl的地图。 我正在使用Geocoder使用地址搜索使用React map GL创建一个地图应用程序。 该地图效果很好。 现在，我需要能够读取用户在子组件Map的输入地址中键入的内容，以便可以在我为其创建的空间（this.state.answerOptionsInputs）中更新主组件App中的状态。问题1）。

enter image description here 我已经尝试过在MapGL组件和Geocoder组件的onChange事件上传递一个函数，但是它不起作用。

Map.js
    <MapGL
            ref={mapRef}
            {...viewport}
            mapStyle="mapBox://styles/mapBox/streets-v9"
            width="100%"
            height="100%"
            onChange={ onSearchLocation }
            onViewportChange={handleViewportChange}
            mapBoxApiAccesstoken={MAPBox_TOKEN}>
            <Geocoder
              mapRef={mapRef}
              containerRef={geocoderContainerRef}
              onViewportChange={handleGeocoderViewportChange}
              mapBoxApiAccesstoken={MAPBox_TOKEN}
              position="top-left"
              onChange={ onSearchLocation }
            />
          </MapGL>

App.js

  handlerLocation(e) {
    const { value } = e.target;
        this.setState (prevstate => {
          return {
            answerOptionsInputs: {
              ...prevstate.answerOptionsInputs,Question1: value
            }
          }
        })   }

<Map onSearchLocation = { this.handlerLocation }/>

非常感谢！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）