/** * module-loader.js * 模块加载器 - 负责动态加载模块HTML/JS,并管理生命周期 * 集成事件总线和生命周期钩子 */ const ModuleLoader = (function() { // 已加载的模块缓存 const loadedModules = {}; // 加载模块 async function loadModule(moduleId, container, params = {}) { if (loadedModules[moduleId]) { console.log(`[loader] 模块 ${moduleId} 已加载,直接显示`); showModule(moduleId, container, params); return; } try { console.log(`[loader] 正在加载模块: ${moduleId}`); // 获取模块URL(这里使用mock-modules下的html文件) const url = `mock-modules/mock-${moduleId}.html`; const response = await fetch(url); if (!response.ok) { throw new Error(`HTTP ${response.status}`); } const html = await response.text(); // 解析HTML,提取body内容作为模块内容 const parser = new DOMParser(); const doc = parser.parseFromString(html, 'text/html'); let moduleContent = doc.body.innerHTML; // 提取script标签并执行 const scripts = doc.querySelectorAll('script'); scripts.forEach(script => { const newScript = document.createElement('script'); if (script.src) { newScript.src = script.src; } else { newScript.textContent = script.textContent; } document.body.appendChild(newScript); // 注意:动态添加的脚本会立即执行 }); // 存储模块内容 loadedModules[moduleId] = { content: moduleContent, scripts: scripts.length }; // 显示模块 showModule(moduleId, container, params); // 触发生命周期 onLoad ModuleLifecycle.triggerLoad(moduleId, params); // 标记已访问(状态管理) if (window.ChannelState) { ChannelState.markModuleVisited(moduleId); } console.log(`[loader] 模块 ${moduleId} 加载完成`); } catch (error) { console.error(`[loader] 加载模块 ${moduleId} 失败:`, error); container.innerHTML = `