在React Native Expo中實現動態模組導入
P粉885562567
2023-08-28 15:01:05
<p>如果我的<strong>React Native</strong> Expo應用程式（在Expo Go應用程式中執行）目前執行一個<code>import/from</code></p>
<pre class="brush:php;toolbar:false;">import Foo, {Bar} 從 "foo";</pre>
<p>如何轉換為動態導入，僅在滿足某個條件時導入，例如當<code>hello === "world"</code>時？ </p>
<p>以下操作會導致應用程式崩潰並顯示錯誤<code>non-std C exception</code>。 </p>
<pre class="brush:php;toolbar:false;">if (hello === "world") {
import Foo, {Bar} from "foo";
}</pre>
<p>嘗試了以下替代方法，但仍然會導致崩潰並顯示<code>non-std C exception</code>：</p>
<pre class="brush:php;toolbar:false;">if (hello === "world") {
const Foo = import('foo')
const Bar = Foo.Bar
}</pre></p>
您可以使用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()回調函數中。此外，您應確保任何依賴導入模組的程式碼只有在模組載入完成後才執行。