Laksanakan import modul dinamik dalam React Native Expo

Question

Jika apl React Native saya (berjalan dalam apl Expo Go) pada masa ini melakukan import/dari

import Foo, {Bar} daripada "foo";

Bagaimanakah saya boleh menukar ini kepada import dinamik yang hanya mengimport apabila syarat tertentu dipenuhi, seperti apabila hello === "dunia"?

Tindakan berikut akan menyebabkan aplikasi ranap dengan ralat bukan-std C++ pengecualian.

if (hello === "world") {
    import Foo, {Bar} daripada "foo";
}

Mencuba penyelesaian berikut tetapi masih mengakibatkan ranap dengan bukan-std C++ pengecualian:

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

Answer 1

Anda boleh menggunakan fungsi import() untuk memuatkan modul secara tidak segerak. Berikut adalah contoh:

let Foo;
let Bar;

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

Dalam kod ini, fungsi import() mengembalikan janji yang diselesaikan kepada objek modul. Atribut lalai bagi objek modul diberikan kepada pembolehubah Foo, dan atribut Bar bagi objek modul diberikan kepada pembolehubah Bar.

Perlu diambil perhatian bahawa fungsi import() adalah tak segerak, jadi sebarang kod yang bergantung pada modul yang diimport hendaklah diletakkan dalam fungsi panggil balik then(). Selain itu, anda harus memastikan bahawa sebarang kod yang bergantung pada modul yang diimport hanya dilaksanakan selepas modul telah dimuatkan.