Question

我似乎无法根据谷歌的脚本GET请求找出解雇函数的方法。

export class Map extends Component {

    constructor(props) {
        super(props);
        this.state = {};
    };

    componentDidMount = function () {
        console.log(google); // Uncaught ReferenceError: google is not defined
    };

    scriptInitialized = function () {
        console.log('scriptInitialized');
    };

    render() {

        let scriptInitialized = function () {
            console.log('scriptInitialized');
        };

        return (
            <div>
                <script type="text/javascript">/* nothing in here works */</script>
                <script src="https://maps.googleapis.com/maps/api/js?key=key&callback=scriptInitialized" defer async={true}/>
            </div>

        );
    }
}

我似乎无法使用 callback = scriptInitialized 来工作。如果我在项目的index.html中保留与src相关的所有JavaScript，但这会使事情变得更复杂。能够将事物集中在这个组件上真是太棒了。

我知道有谷歌地图的第三方库，但如果可能的话，我想避免使用它们。

这个目的的唯一目标是在脚本加载完成后触发事件，这样我就可以使用它而不会触发＆＃34; Uncaught ReferenceError：google未定义＆＃34; 。

Answer 1

来自google api的回调正在寻找window.scriptInitialized。您将scriptInitialized绑定到组件，而不是窗口。这是关于如何在React

中添加窗口功能的link

如何处理React组件中的script.src URL回调？

1 个答案: