如何从“窗口”对象-React中检索数据?

问题描述

我是ReactJS的超级新手。我试图将第三方脚本文件分配给我的Window对象,就像我的componentDidmount方法中的以下代码一样。

        const script = document.createElement("script");
        script.src = "www.xxx.com/src/data.js";
        script.async = true;
        document.body.appendChild(script);
        console.log(window);

从上一个控制台日志中,我得到带有第三方脚本数据的全窗口对象。但是接下来,我尝试在上述代码之后的同一组件中将数据设置为我的状态,如下所示。

           this.setState({
                dataBook: window.databook,dataTopic: window.datatopic
            }) 

,但状态分配为未定义。我也尝试使用头盔和脚本标签npm。我认为我做错了。如何从窗口对象中检索数据?谢谢 完整组件

import React from 'react';
import './App.css';

class App extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            url:"https://example.com/src/customdata.js",dataBook: [],dataTopic: [],dataLesson: [],dataGloss: []
        }
    }

    componentDidMount() {
        const script = document.createElement("script");
        script.src = this.state.url;
        script.async = true;
        document.body.appendChild(script);
        console.log(window);

        this.setState({
                dataBook: window.databook,dataTopic: window.datatopic,dataLesson: window.datalesson,dataGloss: window.datagloss
            })
    }

    render() {
        return (
            <div className="App">
                <div>Book Titles</div>
                {
                    window.databook.map((item)=>{
                        console.log(item)
                    })
                }
                <hr/>

            </div>
        );
    }

}

export default App;

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)

相关问答

Selenium Web驱动程序和Java。元素在(x,y)点处不可单击。其...
Python-如何使用点“。” 访问字典成员?
Java 字符串是不可变的。到底是什么意思?
Java中的“ final”关键字如何工作?(我仍然可以修改对象。...
“loop:”在Java代码中。这是什么,为什么要编译?
java.lang.ClassNotFoundException:sun.jdbc.odbc.JdbcOdbc...