javascript - 在 ReactJS 中需要来自另一个文件的类

Question

我有一个通用的“main.js”，我想从另一个文件中获取一个类。这是我目前所拥有的

结构

main.js
/js
  /src
    menu.js

ma​​in.js

// main.js
var React = require('react');
var ReactDOM = require('react-dom');
require('./js/src/menu.js');

function run() {
    ReactDOM.render(React.createElement(Menu), document.getElementById('menu'));
}

var loadedStates = ['complete', 'loaded', 'interactive'];

if (loadedStates.includes(document.readyState) && document.body) {
  run();
} else {
  window.addEventListener('DOMContentLoaded', run, false);
}

menu.js(为简洁起见进行了编辑)

//menu.js
var React = require('react');
var ReactDOM = require('react-dom');

var Menu = React.createClass({
    render: function() {
        //do things
    }
});

不幸的是，在这一切结束时，我得到了未捕获的 ReferenceError:菜单未定义

我正在使用 browserify 将所有内容编译(？)到项目结构中其他地方的 bundle.js

Answer 1

您需要将所需的 menu.js 对象存储在一个变量中，并在 menu.js 中导出其对象，以便其他模块可以访问它。

在 main.js 中

var Menu = require('./js/src/menu.js');

并在文件末尾的 menu.js 中。

module.exports = Menu;