收到以下错误，表明 initMap 不是函数。我试图不使用任何额外的包来异步加载此脚本或用于 Google Maps API。 我试图仅通过控制台登录 initMap 来查看脚本何时加载，但我仍然收到它不是函数的错误。我可以将此函数移到 componentDidMount 之外，甚至移到 App 组件之外，但错误是相同的。
我的猜测是，这与脚本是通过 document.createElement 加载的事实有关，但 initMap 函数不是，因为当我查看 Google Maps API 的其他示例时，它同时显示 API URL 和index.html 页面上的 initMap 函数。
这个假设正确吗？有没有一种方法可以轻松地将函数作为脚本或 Google Maps API 异步加载到 React 中，而无需使用任何其他包？
Uncaught Ib {message: "initMap is not a function", name: "InvalidValueError", stack: "Error↵ at new Ib (https://maps.googleapis.com/m…ZVRgF122wCkVf4P67Y&v=3.32&callback=initMap:163:56"}
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
ReactDOM.render( < App / > , document.getElementById('root'));
registerServiceWorker();
import React, {
Component
} from 'react'
import './App.css'
let map;
export default class App extends Component {
componentDidMount() {
function initMap() {
console.log('loaded')
}
const script = document.createElement('script')
script.async = true
script.defer = true
script.src = "https://maps.googleapis.com/maps/api/js?key={myAPIkey}=3.32&callback=initMap"
document.head.appendChild(script)
}
render() {
return ( <
div > {
this.map
} <
div style = {
{
width: 500,
height: 500
}
}
id = "map" / >
<
/div>
)
}
}body {
font-family: Arial, sans-serif;
height: 100%;
margin: 0;
padding: 0;
}
#map {
width: 500;
height: 500;
}<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<!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">
<title>React Map</title>
</head>
<body>
<div id="root">
</div>
</body>
</html>最佳答案
事实上，Alexander Staroselsky 注意到，callback=initMap 正在 window 上寻找函数 initMap。您应该将 initMap 函数设置为全局函数，或者将类内的 initMap 函数分配给 window 对象上的变量，如下所示:
window.initMap = this.initMap.bind(this);
关于javascript - React Google map API initMap 不是函数，没有包，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52174642/