如果你打开这套课的目录，第一反应大概是“怎么这么多节”——先别慌。它看着长，但真正需要你坐下来一行行跟的，其实集中在中间那一段。这篇导读想帮你做的，就是把顺序排一下：哪些先看，哪些可以缓一缓，哪些看到一半觉得吃力也很正常。

它到底在讲什么

Pinia 是 Vue 项目里管状态的那一层。你在页面之间传个用户信息、缓存一份列表、让几个组件共享同一个加载状态，最后都会落到这里。这套课围绕的是：怎么把状态从组件里抽出来、怎么组织成一个个独立的 store、怎么在真实项目里用得顺手而不是越写越乱。第 3 版跟着目前主流的写法更新过，组合式写法、TypeScript 的配合这些都在，所以你不太会遇到“教程里的写法已经过时”的那种别扭感。

它不负责教你 Vue 本身。如果你还没写过组件、没搞明白 computed 和 watch 的区别，建议先去把 Vue 的基础过一遍，不然这里的很多例子你会看得云里雾里，那不是你的问题，是顺序问题。

先看哪几讲，别从头硬啃

  • 如果只有零碎时间：先看“为什么要用状态管理”和“第一个 store”这两部分。目标是搞懂 store 是什么、怎么定义、怎么在组件里读和改。
  • 接着看状态修改与派生的那几讲。这块是 Pinia 日常写得最多的，学会之后你就能把手里小项目的状态整理干净。
  • 异步那部分放后面。等前面单机状态写顺了，再来看请求加载、错误处理、loading 标记，会顺很多。
  • 模块拆分和跨 store 调用，建议留到你真的写出一个稍大的 demo 之后再看，否则容易“懂了但用不上”。

综合实战章节不用急着一次性看完，可以先扫一遍结构，知道“一个完整项目里 store 放在哪、怎么分”，需要的时候再回头细看。

哪些可以先跳

环境搭建和配置说明，如果你本地已经有个能跑起来的 Vue 项目，直接跳到 store 的写法就行，不必跟着重新装一遍。插件与持久化那部分，如果你现在做的东西不涉及刷新后保留数据，可以先放着，等真要做登录态、草稿保存的时候再回来。测试相关的内容同理——它有价值，但放在你还没把 Pinia 用起来之前看，收益很低。

跳不是不看，是排到后面。这点上慢一点没关系，别因为“别人都在讲测试”就强迫自己现在啃。

怎么配合练习，才算真的会了

每看完一小段，别急着往下翻。拿你手边任意一个写着玩的小项目，把其中一处状态试着挪进 store，哪怕只有一处。挪的过程里你会碰到“这个值是组件内部的还是共享的”这种判断，这种判断做上三五次，比看十遍讲解都管用。

每两三节整理一份很短的笔记就够，写清楚“这个 API 什么时候用”，三五行即可，不用抄代码。到了实战章节，试着不看讲解先把结构搭出来，卡住了再回去对照——这个“卡住”的过程其实是这套课最值钱的部分。

说点实话

状态管理真正难的不是 API，是“什么该放进去、什么不该”。这一层判断课程只能给你例子，给不了你的项目直觉，那得靠你自己踩几次坑。另外，看完这套课你不会立刻变成前端架构师，它解决的是一件很具体的事：让你的 Vue 项目里那些散落的状态有个安身之处。把它当成一次慢工，碎时间一天看一小节，两周左右能有个清楚的样子。学不会的部分先记下来，往前走，回头再看，往往就通了。


这套 Pinia 实战课程我断断续续看完了，整体编排挺对胃口。第3版内容更新到了目前主流的写法，不是那种拿老版本糊弄人的。

课程推荐

《Pinia实战（第3版）》这套 Pinia 实战课程我断断续续看完了，整体编排挺对胃口。第3版内容更新到了目前主流的写法，不是那种拿老版本糊弄人的。【技能收获】学完可掌握：Vue / 前端工程化。课程以实战为导向，覆盖从基础概念到完整项目落地的关键步骤，配套章节笔记便于课后复盘与面试前快速回顾。【学习建议】建议按目录顺序学习，先打基础再进入综合实战章节；每完成 2～3 节可结合笔记整理一份学习小结，最终尝试独立复现一套完整 Demo 写入个人作品集。【就业发展】可面向岗位：Linux 运维工程师、SRE、云计算工程师、DevOps 工程师。云原生与自动化运维仍是企业 IT 刚需方向，认证 + 实战项目组合能显著提升面试通过率，适合向中高级运维或架构岗进阶。 若你已有一定编程或运维基础，本课程可帮助你在现有技能栈上快速叠加热门方向能力，提升求职时的项目说服力与薪资谈判空间。

视频目录（46 节）

*   1-1 0、Pinia 课程简介.mp4

*   1-2 1、Pinia 简介.mp4

*   1-3 2、安装Node.js.mp4

*   1-4 3、安装VS Code.mp4

*   1-5 4、安装 Pinia.mp4

*   1-6 5、Pinia 基础示例.mp4

*   1-7 6、Pinia Store 简介.mp4

*   2-1 7、Pinia 定义 Store.mp4

*   2-2 8、Pinia 定义 Store 实战.mp4

*   2-3 9、Pinia 使用 Store.mp4

*   2-4 10、Pinia 从 Store 解构.mp4

*   2-5 11、Pinia State.mp4

*   2-6 12、Pinia State TypeScript.mp4

*   2-7 13、Pinia 访问 state.mp4

*   2-8 14、Pinia 重置 state.mp4

*   2-9 15、Pinia 重置 state 使用选项式 API 的用.mp4

*   2-10 16、Pinia 重置 可修改的 state.mp4

*   2-11 17、Pinia 变更 state.mp4

*   2-12 18、Pinia 替换 state.mp4

*   2-13 19、Pinia 订阅 state.mp4

*   2-14 20、Pinia Getter.mp4

*   2-15 21、Pinia Getter 访问其他 getter.mp4

*   2-16 22、Pinia Getter 向 getter 传递参数.mp4

*   2-17 23、Pinia Getter 访问其他 store 的 g.mp4

*   2-18 24、Pinia Getter 使用 setup() 时的用.mp4

*   2-19 25、Pinia Getter 使用选项式 API 的用法.mp4

*   2-20 26、Pinia Action.mp4

*   2-21 27、Pinia Action 访问其他 store 的 a.mp4

*   2-22 28、Pinia Action 使用选项式 API 的用法.mp4

*   2-23 29、Pinia Action 订阅 action.mp4

*   2-24 30、Pinia 插件.mp4

*   2-25 31、Pinia 插件 简介.mp4

*   2-26 32、Pinia 插件 扩展 Store.mp4

*   2-27 33、Pinia 插件 添加新的 state.mp4

*   2-28 34、Pinia 插件 重置插件中添加的 state.mp4

*   2-29 35、Pinia 插件 添加新的外部属性.mp4

*   2-30 36、Pinia 插件 在插件中调用 subscribe和o.mp4

*   2-31 37、Pinia 插件 添加新的选项.mp4

*   2-32 38、Pinia 插件 TypeScript 标注插件类型.mp4

*   2-33 39、Pinia 插件 TypeScript 为新的 sto.mp4

*   2-34 40、Pinia 插件 TypeScript 为新的 sta.mp4

*   2-35 41、Pinia 插件 TypeScript 为新的定义选项.mp4

*   2-36 42、Pinia 单页面应用.mp4

*   2-37 43、Pinia 更真实的示例.mp4

*   3-1 44、Pinia 服务端渲染 (SSR).mp4

*   4-1 45、Pinia 手册.mp4