如果你已经能用 Vue 写出页面，但每次遇到「这个按钮要在三个页面复用」「这个弹窗得让父组件控制开关」「表格列要能自定义」就开始犹豫该用什么写法，那这门课对准的就是这个阶段。它不讲 Vue 基础语法，也不带你从零搭项目，而是把「组件」这一个点拆开讲透。值不值得学，取决于你现在是不是正卡在写组件这件事上。

它解决的是哪类工作场景

实际项目里最耗时间的往往不是写业务逻辑，而是设计组件的接口：数据从哪进、事件从哪出、插槽怎么留、样式会不会互相污染。这门课围绕 Vue 核心组件展开，处理的正是这些反复出现的判断题。比如同一个功能，是写成父子组件用 props 通信，还是用 provide/inject 跨层传递；一个列表项组件要暴露多少自定义能力，才不至于让调用方觉得难用。

讲师是 iView 组件库的作者，三年时间里持续开发并维护了五十多个通用组件。这个背景意味着课程里的例子更接近「被很多人用过、被提过 issue」的真实组件，而不是为了演示 API 临时拼出来的小 demo。你听到的取舍判断，通常来自组件库维护中踩过的坑。

学完能独立做什么

  • 为一组业务页面抽出可复用的通用组件，并定义清晰的 props 和事件边界
  • 用插槽和作用域插槽让组件在保持封装的同时留出定制空间
  • 处理组件间的通信与状态共享，判断什么时候该用哪种方式
  • 写出更容易被他人调用和维护的组件接口，减少后期返工

注意，这里说的是「能独立做」，前提是你跟着示例动手写过。只看讲解不动手，收获大概停留在「知道有这些写法」，遇到真实需求还是会卡。

资料适合什么基础

课程明确面向有一定 Vue 基础的开发者。如果你还没写过组件、不清楚 props 和事件的基本用法，建议先把官方文档过一遍再回来，否则部分内容会显得跳跃。反过来，如果你已经做过一两个项目、被组件的复用和通信问题折磨过，那这门课的信息密度对你来说刚好。

资料以讲解加完整示例为主，重点在技巧和最佳实践，而不是一份可以照着敲的入门手册。用它的时候，比较有效的做法是：每看完一个组件写法，回到自己手头的项目里找一处类似场景改一遍，而不是单纯把示例跑通就过。

怎么用这份资料

建议按主题推进，不要一次刷完。每学完一个组件相关的知识点，挑一个你正在维护的页面，试着把其中重复的部分抽成组件，用课里的思路对比一下自己原来的写法。这种「学一点、改一处」的节奏，比连续看完再回头实践更容易留住东西。

如果时间有限，可以优先看与通信方式和插槽相关的部分，这两块是日常写组件时最常出问题的地方。其余内容按需回看即可。整体来说，这是一门面向「已经会 Vue、但组件写得不够顺」的人的课，如果你的情况和这个描述吻合，它的针对性会比你随便找一份教程强不少。

课程目录

开篇：Vue.js 的精髓——组件 基础：Vue.js 组件的三个 API：prop、event、slot 组件的通信 1：provide / inject 组件的通信 2：派发与广播——自行实现 dispatch 和 broadcast 方法 实战 1：具有数据校验功能的表单组件——Form 组件的通信 3：找到任意组件实例——findComponents 系列方法 实战 2：组合多选框组件——CheckboxGroup & Checkbox Vue 的构造器——extend 与手动挂载——$mount 实战 3：动态渲染 .vue 文件的组件—— Display 实战 4：全局提示组件——$Alert 更灵活的组件：Render 函数与 Functional Render 实战 5：可用 Render 自定义列的表格组件——Table 实战 6：可用 slot-scope 自定义列的表格组件——Table 递归组件与动态组件 实战 7：树形控件——Tree 拓展：Vue.js 容易忽略的 API 详解 拓展：Vue.js 面试、常见问题答疑 拓展：如何做好一个开源项目（上篇） 拓展：如何做好一个开源项目（下篇） 总结