Динамички импорт на ES модули во JavaScript
ES модулите може да се импортираат динамички. Оваа функција понекогаш може да биде корисна. Ајде да погледнеме како се прави тоа. Да претпоставиме дека го имаме следниов модул:
export function func1() {
return '1'
}
export function func2() {
return '2'
}
export default function() {
return 'text';
};
Да претпоставиме дека сакаме да го импортираме овој модул не веднаш, туку по одреден настан, на пример, при клик на копче:
btn.addEventListener('click', function() {
});
Да го импортираме модулот со командата
import:
btn.addEventListener('click', function() {
import('./test.js');
});
Командата import како резултат
враќа промис:
btn.addEventListener('click', function() {
import('./test.js').then(mod => {
});
});
Во променливата на колбекот ќе дојде објект со экспортираните функции:
btn.addEventListener('click', function() {
import('./test.js').then(mod => {
let res1 = mod.func1();
let res2 = mod.func2();
console.log(res1, res2);
});
});
Она што е експортирано по стандард,
ќе се наоѓа во клучот default:
btn.addEventListener('click', function() {
import('./test.js').then(mod => {
let dfn = mod.default;
console.log(dfn);
});
});
Може да се изврши деструктурирање при импорт:
btn.addEventListener('click', function() {
import('./test.js').then(({func1, func2}) => {
let res1 = func1();
let res2 = func2();
console.log(res1, res2);
});
});
Направете модул кој експортира низа
со имиња на деновите во неделата. При притискање на копче
импортирајте го овој модул и прикажете ги
деновите во неделата во форма на список ul.
