Question

我正在使用react-google-maps。我显示了地图，然后当有人单击地图时，在地图上放置了一个标记。每当这第一次发生时，我总是会收到此警告：

警告：无法在已卸载的组件上执行React状态更新。这是空操作，但表明您的应用程序中发生内存泄漏。

似乎在执行操作时已卸载地图。我不确定 withScriptjs 或 withGoogleMap 中是否发生了某种重新渲染装饰。每次我再次单击地图上的标记时，问题似乎都消失了（仅在第一次时发生）

我的代码如下：

class ShopMap extends React.PureComponent<Props, State> {
    constructor(props) {
        super(props);
        this.state = {};
        this.state.location = props.locationValue;
    }

    onMapClick = elem => {
        let location = { location: { lat: elem.latLng.lat(), lng: elem.latLng.lng() } };

        this.props.handleLocationChange(location);
        this.setState(location); //warning is displayed here!!!!!
    };

    render(): React.Node {
        let locationToDisplay = '';
        if (!this.state.location || this.state.location === '')
            locationToDisplay = { lat: 48.1764102, lng: 11.5936917 };
        else
            locationToDisplay = this.state.location;

        return (
            <React.Fragment>
                <GoogleMap defaultZoom={15} defaultCenter={locationToDisplay} onClick={this.onMapClick}>
                    {this.state.location && this.state.location != '' && <Marker position={this.state.location} />}
                </GoogleMap>
            </React.Fragment>
        );
    }
}

export default withScriptjs(withGoogleMap(ShopMap));

知道为什么会这样吗？

首次单击地图时，反应状态更新警告

0 个答案: