采用“环境搭建—>基础封装—>业务进阶—>高阶表单/表格—>工程化发布”的五阶跃迁模型，带你从Vite项目初始化与Element Plus集成起步，深度透彻掌握Vue3组合式API、TypeScript类型定义与组件通信机制，构建坚实的前端组件化底座。课程核心聚焦于企业级业务痛点，通过省市区联动、图标选择器、无限级导航菜单等真实场景，解决通用UI库无法满足复杂业务需求的难题。你将亲手封装配置驱动的超级表单（集成富文本/上传）与高性能数据表格（支持分页/行编辑/自定义插槽），并深入FullCalendar日历集成。最后通过VuePress文档搭建与NPM发布，掌握从代码编写到开源分发的完整闭环。这不仅是组件的堆砌，更是对2026年企业级“高复用、强类型、低耦合”前端架构能力的深度重塑，助你从一名页面开发者蜕变为具备库设计与工程化思维的稀缺前端专家。
课程目录：
element-plus业务组件
+—{1}–第1章课程简介
| [1.1]–1-1导学_ +备用微信285400694[2].mp4
| [1.2]–1-2二次封装的意义_ +备用微信285400694[2].mp4
|
+—{2}–第2章封装组件初级篇（上）
| [2.10]–2-10省市区选择组件-巧用watch来达到三级联动效果_ .mp4
| [2.11]–2-11省市区选择组件-完善省市区联动组件并给父组件分发事件_ .mp4
| [2.12]–2-12利用app.use特性全局注册组件_ .mp4
| [2.1]–2-1搭建vite项目并配置路由和element-plus_ .mp4
| [2.2]–2-2全局注册图标_ .mp4
| [2.3]–2-3伸缩菜单-完成伸缩菜单基本功能_ .mp4
| [2.4]–2-4伸缩菜单-抽离头部和侧边栏组件并完善伸缩菜单_ .mp4
| [2.5]–2-5图标选择器-巧用两次watch控制弹框的显示与隐藏_ .mp4
| [2.6]–2-6图标选择器-巧用component动态组件显示所有的图标_ .mp4
| [2.7]–2-7图标选择器-利用命名空间修改dialog样式_ .mp4
| [2.8]–2-8图标选择器-通过自定义hooks函数实现复制功能_ .mp4
| [2.9]–2-9省市区选择组件-利用github获取到省市区数据_ .mp4
|
+—{3}–第3章封装组件初级篇（下）
| [3.1]–3-1趋势标记-图标的组合使用实现上升下降趋势_ +更新备用微信[2].mp4
| [3.2]–3-2趋势标记-动态绑定class的妙用实现颜色反转_ +更新备用微信[2].mp4
| [3.3]–3-3趋势标记-计算属性的妙用实现文字颜色_ +更新备用微信[2].mp4
| [3.4]–3-4通知菜单-icon和badge组件的组合使用_ +更新备用微信[2].mp4
| [3.5]–3-5通知菜单-封装一个列表组件(上)_ +更新备用微信[2].mp4
| [3.7]–3-7通知菜单-完善list组件并融合进通知菜单_ +更新备用微信[2].mp4
|
+—{4}–第4章封装组件中级篇iclass=new_tagi
| [4.10]–4-10城市选择组件-组合式使用组件完成基本布局.mp4
| [4.11]–4-11城市选择组件-获取城市数据并显示所有城市.mp4
| [4.12]–4-12城市选择组件-绑定事件并实现点击字母跳转到对应区域.mp4
| [4.13]–4-13城市选择组件-完善按省份选择城市.mp4
| [4.14]–4-14城市选择组件-使用filter-method实现搜索过滤.mp4
| [4.1]–4-1导航菜单-导航菜单的需求分析和数据设计.mp4
| [4.2]–4-2导航菜单-巧用template实现两级结构的菜单.mp4
| [4.3]–4-3导航菜单-使用tsx实现无限层级菜单.mp4
| [4.4]–4-4导航菜单-利用封装好的导航菜单组件改造项目整体结构.mp4
| [4.5]–4-5导航菜单-完善细节并增加自定义键名功能.mp4
| [4.6]–4-6进度条-完成进度条动态加载效果.mp4
| [4.7]–4-7时间选择组件-完成时间选择组件的全部功能.mp4
| [4.8]–4-8时间选择组件-完成日期选择组件所有功能.mp4
| [4.9]–4-9时间选择组件-修复日期选择组件结束日期未清空问题.mp4
|
+—{5}–第5章封装组件高级篇（上）iclass=new_tagi
| [5.10]–5-10表单组件-完善表单重置逻辑_ +备用微信更新[2].mp4
| [5.11]–5-11表单组件-弹出框表单的基本结构_ +备用微信更新[2].mp4
| [5.12]–5-12表单组件-使用defineExpose获取表单实例方法_ +备用微信更新[2].mp4
| [5.13]–5-13表单组件-完善表单逻辑_ +备用微信更新[2].mp4
| [5.1]–5-1表单组件-一个强大的表单组件应该具备哪些功能_ +备用微信更新[2].mp4
| [5.2]–5-2表单组件-使用ts定义表单配置项的数据类型_ +备用微信更新[2].mp4
| [5.3]–5-3表单组件-使用配置的数据完成一个基本版表单_ +备用微信更新[2].mp4
| [5.4]–5-4表单组件-巧用component动态组件配置添加子元素组件_ +备用微信更新[2].mp4
| [5.5]–5-5表单组件-单独处理上传组件-1_ +备用微信更新[2].mp4
| [5.6]–5-6表单组件-单独处理上传组件-2_ +备用微信更新[2].mp4
| [5.7]–5-7表单组件-巧用插槽给表单加上操作项_ +备用微信更新[2].mp4
| [5.8]–5-8表单组件-完善表单上传逻辑_ +备用微信更新[2].mp4
| [5.9]–5-9表单组件-集成富文本编辑器wangeditor_ +备用微信更新[2].mp4
|
+—{6}–第6章 封装组件高级篇（下）
| 6-1 表格组件-一个强大的表格应该具备哪些功能【更新备用微信】.mp4
| 6-10 表格组件-实现表格分页功能【更新备用微信】.mp4
| 6-2 表格组件-使用 ts 定义表格组件需要的类型【更新备用微信】.mp4
| 6-3 表格组件-通过配置的数据完成一个基础版表格【更新备用微信】.mp4
| 6-4 表格组件-巧用插槽实现操作项和自定义列数据【更新备用微信】.mp4
| 6-5 表格组件-为表格加上loading效果【更新备用微信】.mp4
| 6-6 .表格组件-实现可编辑单元格功能【更新备用微信】.mp4
| 6-7 表格组件-实现可编辑行功能-1【更新备用微信】.mp4
| 6-8 表格组件-实现可编辑行功能-2【更新备用微信】.mp4
| 6-9 表格组件-修复冒泡事件带来的问题【更新备用微信】.mp4
|
+—{7}–第7章封装组件拓展篇
| readme.md
| [7.1]–7-1日历组件-element-plus日历组件的不足和为何选择.mp4
| [7.2]–7-2日历组件-使用fullcalendar配置生成日历.mp4
| [7.3]–7-3日历组件-日历的事件渲染和点击事件处理.mp4
| [7.4]–7-4日历组件-自定义渲染日历内容.mp4
| 资料文档.zip
|
+—{8}–第8章使用vuepress编写组件文档
| readme.md
| [8.1]–8-1-实现组件的全量打包.mp4
| [8.2]–8-2.单独打包每个组件实现按需引入.mp4
| [8.3]–8-3.发布组件库到npm.mp4
| [8.4]–8-4.如何更新已经发布的组件库版本.mp4
| [8.5]–8-5.如何在github部署预览项目.mp4
| [8.6]–8-6.如何在码云部署预览项目.mp4
| [8.7]–8-7.组件库文档首页编写.mp4
| [8.8]–8-8.编写文档网站头部导航和侧边导航.mp4
| [8.9]–8-9.集成组件库并添加显示和交互.mp4
| 更新说明.txt
| 资料文档.zip
|
\—资料
m-element-components-master_微信.zip
下载地址：
感谢您的来访，获取更多精彩文章请收藏本站。
