React Native：如何将文件拆分为多个文件并导入它们？

Posted 2023-02-22

【中文标题】React Native：如何将文件拆分为多个文件并导入它们？

【英文标题】：React Native: How to split a file up into multiple files and import them?

【发布时间】：2015-12-31 15:10:25

【问题描述】：

我正在用 react native 编写我的第一个应用程序，我的 js 文件变得非常大。拆分文件的正确方法是什么。

如果我有类似的东西

var MyClass = React.createClass(
  ...
)

我可以将它保存在myclass.js 并通过某些命令包含在另一个 js 文件中吗？

【参考方案1】：

这里是使用 import 语句的更新解决方案（在最新的 React-Native 和通常遵循 ECMAScript6 及更高版本的 javascript 中）：

file1 myClass.js:

export default class myClass ...

file2 app.js:

import myClass from './myClass';

这是使用单个 default 导出的基本版本。您还可以导出必须在导入时明确列出的 named 导出。有关详细信息，请参阅 export 和 import。

【讨论】：

./（点斜杠）在导入本地文件时很重要，它解决了我的问题。谢谢

【参考方案2】：

一般而言，您可以执行以下操作：

var MyClass = React.createClass(
    ...
)

module.exports = MyClass;

这样你就可以知道什么应该公开。

然后，在您以前的大文件中，您可以像这样加载内容：

var MyClass = require('./myclass.js');

Require 返回引用 module.exports 值的对象。

【讨论】：

很好，谢谢。是否也可以导出多个类？

我相信是的。将 MyClass 分配给 module.exports.MyClass 然后通过调用 require('./MyClass.js').MyClass 将其导入。您必须为分配给导出的每个类执行此操作。