# 組件實踐 ## 什么是組建 在用戶幾面開發領域，它是一種面對用戶的，獨立的可復用交互元素的封裝 易用，容易擴展 - 理解常規的組件實現流程 - 鞏固前置課程的部分知識 - 避免常見誤區 ### 流程 - 分析：交互意圖及需求 - 結構：HTML+CSS實現靜態結構 - 接口：定義公共接口 - 實現：從抽象到細節，實現功能接口、暴露事件 - 完善：便利接口、插件封裝、重構等 ## Modal - 需求分解 - 模態窗口垂直水平居中 - 需要半透明的遮罩背景 - 可自定義彈窗內容和標題 - 提供確認和取消操作 - 頁面-結構分解 - 定義公共接口 - 初始化Modal - 方法調用 - 實現：從抽象到細節 - 使用事件Mixin - 監聽者模式（訂閱發布模式，解耦，將調用與被調用者接口） 要點總結：基于‘類’組織 要點總結：結構復用 ## 輪播圖 - 需求分解 - 模態窗口垂直水平居中 - 滾動條目不受限制 - 可前后翻動，支持拖拽 - 可直接定位