bir*_*d03 3 javascript google-maps
在这里反应JS新手,所以请耐心等待.
我在我的index.html文件中添加了Google Maps API脚本,如下所示:
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta name="theme-color" content="#000000">
<link rel="manifest" href="%PUBLIC_URL%/manifest.json">
<link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/latest/css/bootstrap.min.css">
</head>
<body>
<div id="root"></div>
<script src="https://maps.googleapis.com/maps/api/js?key=MY-API-IS-HERE"></script>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
然后,我安装google-maps-react了npm所以我可以使用它的组件.我在我的组件中导入了这个库,如下所示:
import React, { Component } from 'react';
import GoogleMapReact from 'google-map-react';
class BaseMap extends Component {
constructor() {
super();
this.state = {
center: {lat: 42, lng: 14},
zoom: 10
}
};
render() {
let location = {
center: '',
zoom: ''
}
return (
<GoogleMapReact>
</GoogleMapReact>
);
}
myMethod(){
let geocoder = new google.maps.Geocoder();
}
}
export default BaseMap;
Run Code Online (Sandbox Code Playgroud)
但是,当我尝试使用时google.maps.Geocoder,我得到:
Line 30: 'google' is not defined no-undef
Run Code Online (Sandbox Code Playgroud)
据我所知,google应该是一个全局的窗口对象,因为我在html文件中包含了Google Maps API脚本.但是,它没有定义.
有任何想法吗?Tnx提前!
好的,这似乎有效:
解决方案是google在类上面的变量中隐式定义,如下所示:
const google = window.google
Run Code Online (Sandbox Code Playgroud)
这里回答:
谷歌没有使用create-react-app在react应用程序中定义
| 归档时间: |
|
| 查看次数: |
3423 次 |
| 最近记录: |