谷歌地图反应显示类型错误答案

【问题标题】：Google map react showing type errors谷歌地图反应显示类型错误
【发布时间】：2020-03-27 08:19:55
【问题描述】：

我正在尝试使用 ionic 和 reactjs 构建应用程序。想要显示谷歌地图并安装了 google-maps-react 包。但是，下面的例子抛出了错误

绑定元素“文本”隐含地具有“任何”类型。 TS7031

import React, { Component } from 'react';
import GoogleMapReact from 'google-map-react';

const AnyReactComponent = ({ text }) => <div>{text}</div>;

class SimpleMap extends Component {
  static defaultProps = {
    center: {
      lat: 59.95,
      lng: 30.33
    },
    zoom: 11
  };

  render() {
    return (
      // Important! Always set the container height explicitly
      <div style={{ height: '100vh', width: '100%' }}>
        <GoogleMapReact
          bootstrapURLKeys={{ key: /* YOUR KEY HERE */ }}
          defaultCenter={this.props.center}
          defaultZoom={this.props.zoom}
        >
          <AnyReactComponent
            lat={59.955413}
            lng={30.337844}
            text="My Marker"
          />
        </GoogleMapReact>
      </div>
    );
  }
}

export default SimpleMap;

【问题讨论】：

您的密钥设置是否正确？这似乎是他们存储库中的复制/粘贴代码，我猜不出你后来做了什么......

标签： reactjs ionic-framework google-maps-react

【解决方案1】：

我相信这是一个打字错误......这样的事情可能会让你朝着正确的方向前进

interface AnyReactComponentProps {
   text: string;
   lat: any;
   lng: any;
}
const AnyReactComponent: React.FC<AnyReactComponentProps> = ({ text }) => <div>{text}</div>;

【讨论】：