反应包括脚本数据无法识别

Question

我有一个index.html页，其中包括定义一个简单的变量JavaScript文件中的阵营设置：

var pData = {}; 

里面我index.js文件，我试图访问这个变量一个简单的方法：

ReactDOM.render(
    <App presData={ pData }/>, 
    document.getElementById('root') 
); 

但运行npm start这并不编译，因为它说'pData' is not defined后。

当我添加一些调试我得到的东西真的很奇怪，我说：

var testData; 
if (typeof pData === "object") { 
    testData = pData; // Fails on this line because pData is not defined! 
} else { 
    alert("Typeof pData inside index.js: " + (typeof pData)); 
} 

，因为变量是不是当变量被定义为一个对象，只是执行的代码块中定义上面的代码失败。

这是怎么可能的，以及如何访问React文件中的这个变量？

在此先感谢您的帮助。

保罗

Answer 1

你可以用它window.pData = {};将可用，但它不是一个很好的做法。如果你使用ES6和babel，你可以用import导入你的变量。

myData.js

var pData = {}; 
export default pData; 

index.js：

import pData from './myData.js'; 

ReactDOM.render(
    <App presData={ pData }/>, 
    document.getElementById('root') 
); 

Answer 2

这是因为你的js文件包括HTML，所以当盯着编译，index.js不知道在哪里pData定义。

假设代码var pData = {};是在一个名为data.js文件，它在与index.js同一个文件夹，尽量

import './data.js'; 

在index.js文件第一线;