Question

我有一个遗留企业应用程序，其中包含许多组件，这些组件已呈现到页面上的多个锚点。下面的例子

modals.js

import etc
class MyModal extends Component {
  render() {
     return <span>a modal</span>
  }
}

var modals = $('.react__modal');
if (modals.length) {
   modals.each(function() {
      ReactDOM.render(<MyModal />,this);
   });
}

现在假设我对该应用程序有多个区域，例如admin.js，frontend.js，account.js，是否可以将modals.js导入到所有这些区域中要包含的内容中还是我必须导出该类，然后在我的每个区域中对我的ReactDOM.render进行多个声明。

我大约有100个这样的组件，我宁愿不必在所有区域上重复渲染（总共6个）。

当前使用gulp进行编译，但是正在迁移到webpack（使用laravel mix）。

Answer 1

您可以尝试使用导出：

export default class MyModal extends Component

然后在其他组件中，您可以导入并使用：

import MyModal from "./yourPathToComponent"

您可以导入已经包含reactDOM渲染调用的文件吗？

1 个答案: