Implementieren Sie den dynamischen Modulimport in React Native Expo

Question

Wenn meine React Native Expo-App (die in einer Expo Go-App ausgeführt wird) derzeit einen import/from

import Foo, {Bar} aus "foo";

Wie kann ich dies in einen dynamischen Import umwandeln, der nur importiert, wenn eine bestimmte Bedingung erfüllt ist, z. B. wenn hello === "world"?

Die folgenden Aktionen führen zum Absturz der Anwendung mit dem Fehler non-std C++-Ausnahme.

if (hello === "world") {
    import Foo, {Bar} aus „foo“;
}

Die folgende Problemumgehung wurde versucht, führt aber immer noch zu einem Absturz mit einer nicht standardmäßigen C++-Ausnahme:

if (hello === "world") {
    const Foo = import('foo')
    const Bar = Foo.Bar
}

Answer 1

您可以使用import()函数异步加载模块。以下是一个示例：

let Foo;
let Bar;

if (hello === "world") {
  import("foo").then((module) => {
    Foo = module.default;
    Bar = module.Bar;
  });
}

在这段代码中，import()函数返回一个解析为模块对象的promise。模块对象的default属性被赋值给Foo变量，模块对象的Bar属性被赋值给Bar变量。

需要注意的是，import()函数是异步的，因此任何依赖于导入模块的代码应该放在then()回调函数中。此外，您应确保任何依赖于导入模块的代码只有在模块加载完成后才执行。