Question

我已经创建了一个服务器渲染的react应用。在不同的页面中，我尝试从用户那里获取多个地址，并且希望在Google Maps上标记输入的位置。

出于测试目的（熟悉geocode），我像reference一样添加了react-geocode。但是，我得到了错误：

ReferenceError: fetch is not defined at /home/.../node_modules/react-geocode/lib/index.js:1:255

这是组件：

    import GoogleMapReact from 'google-map-react';
    import Geocode from "react-geocode";
    ...//other imports

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

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

      static async getInitialProps(props) {
        let addresscounts = await tracker.methods.zipCounts().call()

        //////////////////////////react-geocode////////////////////

        Geocode.setApiKey("~~~ API KEY ~~~");
        Geocode.fromAddress("Eiffel Tower").then(
          response => {
            const { lat, lng } = response.results[0].geometry.location;
            console.log(lat, lng);
          }, error => { console.error(error) }
        );

        ///////////////////////////////////

        return {
          addresscounts
        };
      }

      render(){
        return(
          <div style={{ height: '100vh', width: '100%' }}>
            <GoogleMapReact
              bootstrapURLKeys={{ key: "~~~ API KEY ~~~"}}
              defaultCenter={this.props.center}
              defaultZoom={this.props.zoom}
            >
              <AnyReactComponent
                lat={59.955413}
                lng={30.337844}
                text="My Marker" />
            </GoogleMapReact>
          </div>
        );
      }
    }

  export default History;

有人可以告诉我问题是什么以及如何解决？我是否需要通过fetch API（node-fetch）发送请求？

Answer 1

node-fetch未在Node中实现。

您需要为此使用外部模块，例如here。

像这样在您的Node应用程序中安装

npm i node-fetch --save

然后将下面的行放在使用fetch API的文件的顶部：

const fetch = require("node-fetch");

请参见Adrian T的原始答案https://laravel.com/docs/5.8/eloquent-relationships#polymorphic-relationships

ReferenceError：未定义提取-React Geocode

1 个答案: