我创建了一个服务器渲染的react
应用程序。在不同的页面中,我尝试从用户那里获取多个地址,并且我想在Google Maps
.
出于测试目的(熟悉geocode
),我添加了与参考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)发送请求吗?