在客戶端，我只想匯入 Javascript 模塊的特定部分。但我想按需執行，例如當用戶執行需要模塊特定部分的操作時。我能夠在 HTML 檔案中實作這一點，其中：
<script type="module">
import { sayHi } from "/public/js/sayHi.js";
sayHi("John");
</script>
現在我想做同樣的事情，但在我的客戶端 JS 檔案中，以便我在需要時運行此加載（而不是在頁面加載時，如上例所示）。我從解決它中得到的最接近的是在我的客戶端 JS 檔案中運行它：
import("/public/js/sayHi.js")
但問題是最后一個腳本加載了整個模塊，而不僅僅是我想要的部分。如果我嘗試這樣做：
import { sayHi } from "./sayHi.js";
我收到錯誤“無法在模塊外使用匯入陳述句”。
如何通過客戶端 JS 僅匯入 { sayHi } 部分？
PS：舉個例子，我想在我的客戶端JS中有這樣的東西：
buttonX.addEventListener('click', async () => {
const a = await import { sayHi } from "./sayHi.js";;
});
uj5u.com熱心網友回復：
它加載整個模塊，而不僅僅是我想要的部分
它總是如此，你無法避免。當您使用時也會發生這種情況import {…} from '…'- 它只是不會將所有內容匯入當前模塊范圍。就像你打電話時一樣import(…)，你不必使用所有可用的部分：
buttonX.addEventListener('click', async () => {
const { sayHi: a } = await import("./sayHi.js");
a();
});
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/477454.html
標籤：javascript ecmascript-6 es6-模块 es6-模块加载器
上一篇：Vue觸發請求從API獲取資料
下一篇：單擊第一個按鈕后的第二個按鈕延遲