如果你用 Vue 做过两三个项目，按钮、输入框、弹窗、菜单这些组件基本靠现成 UI 库解决，那这门「vue造轮子」值得先掂量一下自己的缺口。它讲的不是怎么用组件库，而是把组件库拆开，自己动手写一遍。写不出来，说明你对 Vue 的理解还停在使用层。
先自查：这几个问题你能答上来吗
不看源码、不查文档，试着回答：一个 Button 组件要支持哪些 props，怎么设计才不会越写越乱？父组件给子组件传值，子组件想改回去，为什么推荐用事件而不是直接改 prop？插槽默认内容、具名插槽、作用域插槽分别在什么场景用？v-model 在自定义组件上到底做了什么？
这些问题的答案不难查，但真正写组件时会卡住的地方往往不在这里，而在「边界」：点击态、禁用态、加载态、尺寸组合、事件透传、样式冲突。造轮子的过程，就是被这些边界反复教育的过程。如果你从没认真想过这些，这门课属于你。
它到底造什么轮子
课程围绕一套 Vue UI 框架的构建展开，按初级、进阶、高级三段推进。初级解决的是「单个组件怎么写得干净」：props 怎么定义、事件怎么抛、插槽怎么留口子、样式怎么做隔离和主题变量。进阶会碰到组件之间怎么组合、怎么让一组组件共享状态与配置，比如表单里的校验、布局容器与子项的配合。高级阶段进入更偏架构的层面，涉及组件库整体的组织方式、按需加载、以及怎么让写出来的东西别人也能用。
三个阶段不是三套独立内容，而是同一套框架不断加码。这也是它和零散看几篇组件教程的区别：散着看，你拿到的是一个个技巧；跟着一条线走，你拿到的是「一个组件库为什么长这样」的判断力。
配套练习怎么用
造轮子这类课，只看不写等于没学。比较实在的用法是：每讲一个组件，先关掉视频自己写一遍，写不出来再回头看。重点不是写出和示例一模一样的代码，而是搞清楚作者为什么这么切分，比如为什么把状态提到外面、为什么用 provide/inject 而不是一层层传。
另一个练法是反向拆解。拿你项目里正在用的某个组件，试着说出它的 props 和事件设计，再看看自己会怎么改。造轮子练的是设计决策，不是把 API 背下来。学完一个组件，顺手在自己的小项目里用一次，比做十遍示例都管用。
看完你应该能回答
- 一个可复用的 Vue 组件，props、事件、插槽三者的职责边界怎么划分？
- 为什么组件内部不直接修改传入的数据？v-model 在自定义组件上如何实现双向绑定？
- 多个组件需要共享配置或状态时，有哪几种方案，各自的代价是什么？
- 组件样式如何做到既隔离又不失灵活，主题切换的思路是什么？
- 如果让你从零组织一个组件库的目录和导出方式，你会怎么开始？
这些问题答不上来，就说明缺的正是这块。答得上来的部分，可以跳过对应阶段，不必从头看。缺什么补什么，才是这门课正确的打开方式。
vue造轮子
课程详情
课程详情
课程名称：vue造轮子
课程核心介绍
本课程将深入讲解Vue UI框架的构建，涵盖从初级到高级的全面知识。课程分为三个阶段：Vue UI框架-初级版、Vue UI框架-进阶版、Vue UI框架-高级版，旨在帮助学员逐步掌握Vue UI框架的设计与实现。
适合人群
- 对Vue框架有基础了解的开发者
- 希望提升UI组件开发能力的工程师
- 对前端架构和组件化开发有兴趣的学习者
学习收获
- 掌握Vue UI框架的基本原理和设计模式
- 能够独立开发高质量的Vue UI组件
- 提升前端开发效率和组件复用能力
课程亮点
- 理论与实践相结合，注重实战操作
- 逐步进阶，从基础到高级，全面覆盖Vue UI框架知识
- 丰富的案例和项目实战，提升学员实际应用能力
课程目录
Vue UI 框架-初级版
Vue UI 框架-进阶版
视频
07.单元测试与Mock
0203
0204
0205
0206
0207
0303
0304
0305
0403
0404
0405
0406.添加loading
0505
0506
0507
0508
0509
0602
0603
0604
0605
0606
0607
0702
0703
0704
0705
0706
0707
0708
0802
0803
0804
0805
0806
0902
0903
0904
0905
0906
0907
0908
0909
0910
0911
0912
0913
0914
1002
1003
1004
1005
1006
1007
1008
1009
1103
1104
1105
1106
1107
1108
1109
1110
1111
1112
1113
1114
1115
1116
1202
1203
1204
1205
1206
1207
1208
1209
资料
01.测一测你的JavaScript、Vue基础
01.课程简介.md
02.课程介绍
01.课程简介.md
02.讲义.md
08.Vue造轮子第一课习题.md
08.Vue造轮子第一课习题[答案].md
09.关于轮子的面试题.md
03.体验、交互、sketch
01.课程简介.md
06.UI测试题.md
06.UI测试题[答案].md
04.框架雏形、单元测试、Mock数据
01.课程简介.md
05.单元测试、自动化测试、持续集成、NPM 发布包
01.课程简介.md
06.测试覆盖率
01.课程简介.md
07.升级的 table 组件
01.课程简介.md
08.Vuex的原理和用法
09.Datepicker 组件
01.课程简介.md
10.自制路由器
11.滚动组件
01.课程简介.md
02.代码.md
12.管理后台的设计思路
01.课程简介.md
Vue UI 框架-高级版
视频
0202
0204
0205
0206
0207
0303
0304
0305
0403
0404
0405
0406
0407
0505
0506
0507
0508
0509
0603
0604
0605
0606
0607
0608
0609
0610
0611
0702
0703
0704
0705
0706
0707
0802
0803
0804
0805
0806
0807
0902
0903
0904
0905
0906
0907
0908
0909
0910
0911
1002
1003
1004
1005
1006
1007
1009
1010
1011
1012
1102
1202
1203
1204
1302
1303
1304
1402
1403
1404
1405
1406
1407
1408
1409
1410
1411
1412
1413
1414
1415
1416
1417
1418
1502
1503
1504
1505
1506
1507
1508
1509
1510
1511
1512
1513
1514
1515
1602
1603
1702
1704
1705
1706
1707
1708
1709
1710
1802
1803
1804
1805
1806
1807
1808
1902
1903
1904
1905
1906
1907
课件
02.课程介绍
01.课程简介.md
09.关于轮子的面试题[答案].md
03.体验、交互、sketch
01.课程简介.md
02.讲义.md
06.UI测试题.md
06.UI测试题[答案].md
04.框架雏形、单元测试、Mock数据
01.课程简介.md
02.讲义.md
08.项目搭建.md
08.项目搭建[答案].md
05.单元测试、自动化测试、持续集成、NPM 发布包
06.省市区级联选择组件(上)
07.省市区级联选择组件(下)
01.课程简介.md
08.深入讲解Vue 动画原理
09.无缝轮播组件
10.Nav 组件
11.使用 Karma做测试
12.表单验证
13.分页组件
14.Table 组件
01.课程简介.md
15.图片上传组件（单文件）
16.中级轮子：图片上传组件（多文件）
17.中级轮子：图片上传的单元测试
18.Sticky 组件
19.课程总结
